Closed Bug 1682159 Opened 2 years ago Closed 2 years ago

Wrong print style because :defined doesn't apply to the static clone.

Categories

(Core :: Printing: Output, defect)

Firefox 85
defect

Tracking

()

RESOLVED FIXED
86 Branch
Tracking Status
firefox86 --- fixed

People

(Reporter: 709922234, Assigned: emilio)

References

Details

Attachments

(5 files)

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:85.0) Gecko/20100101 Firefox/85.0

Steps to reproduce:

  1. visit https://gem-book.js.org/en/guide/cli
  2. open Devtools > Inspector, enable "print media simulation"
  3. click menu File > Print

Actual results:

see screenshot

Expected results:

see screenshot

Attached image print simulation

In particular, I don’t know why the background and text colors of the code block have changed, and the custom elements display undefined styles.

Attached image chrome print effect

Chrome's printing effect is the same as I expected

Component: Untriaged → Printing: Output
Product: Firefox → Core

https://developer.mozilla.org/en-US/docs/Web/CSS/color-adjust

The background color is for this reason. I can set color-adjust: exact; to solve.

But the printing style of custom elements I think is problematic

See Also: → 1682193

Fun:

        :not(:defined)::before {
          display: block;
          content: 'The element is not defined';
          padding: 1em;
          border-radius: 4px;
          text-align: center;
          background: var(--border-color-sbqar);
        }
Assignee: nobody → emilio

With that, the print output is as expected. But note that that page still hits the slicing fallback because it seems <gem-book> is a grid, and fragmenting a single column grid is borked (see bug 1417615).

You'd get even better print rendering with @media print { :host { display: block } } in the <gem-book> element.

Status: UNCONFIRMED → NEW
Ever confirmed: true
Summary: Wrong print style → Wrong print style because :defined doesn't apply to the static clone.

Unbelievable, there are fixes so soon.

I have been using Firefox Nightly and I have not found a problem with the grid. Thank you for your suggestion.

Pushed by ealvarez@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/b90e93c4aa5c
Copy defined state to static clones. r=edgar
https://hg.mozilla.org/integration/autoland/rev/bee3e0399e0d
Do a minor cleanup of the Element clone code. r=edgar
Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/26887 for changes under testing/web-platform/tests

Backed out for failing print reftest animations-print.html

Backout link: https://hg.mozilla.org/integration/autoland/rev/72ddac4860373e30a1815bf645a8782dfaf511d7

Flags: needinfo?(emilio)
Upstream PR merged by moz-wptsync-bot
Attachment #9192953 - Attachment description: Bug 1682159 - Do a minor cleanup of the Element clone code. r=smaug,edgar → Bug 1682159 - Do a minor cleanup of the Element clone code. r=edgar
Flags: needinfo?(emilio)
Pushed by ealvarez@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/e72dab7cb89d
Do a minor cleanup of the Element clone code. r=edgar
Status: NEW → RESOLVED
Closed: 2 years ago
Resolution: --- → FIXED
Target Milestone: --- → 86 Branch

When printing the page as a .pdf, the link cannot be clicked.
Does this need to be fixed?

That's bug 454059.

You need to log in before you can comment on or make changes to this bug.