1594107 - readability backplate obscured content issues

Status: RESOLVED DUPLICATE of bug 1594099

(Core :: Layout, defect, P2)

Description

[Asa Dotzler [:asa]]

On some websites, the readability backplate implemented at bug 1539212 seems to show up unexpectedly and block content.

It's my guess that these rogue backplates are showing up where some kind of hidden text is happening but I could be wrong.

The two examples I've found are at engadget.com and bing.com which I document here in screenshots.

Tested on Windows 10 with High Contrast Black OS theme enabled on today's Firefox Nightly.

Comment 1

[Asa Dotzler [:asa]]

Attachment: edgadget-firefox.png

Comment 2

[Asa Dotzler [:asa]]

Attachment: engadget-edge.png

Comment 3

[Asa Dotzler [:asa]]

Attachment: bing-firefox.png

Comment 4

[Asa Dotzler [:asa]]

Attachment: bing-edge.png

Comment 5

[Morgan Reschenberg [:morgan]]

I think this has to do with how we turn bullets into lines; see uploaded sample.html and bullet-test.png

Comment 6

[Morgan Reschenberg [:morgan]]

Attachment: sample.html

Comment 7

[Morgan Reschenberg [:morgan]]

Attachment: bullets-test.png

Comment 8

[Morgan Reschenberg [:morgan]]

Here's a frame dump of that test case:

      Block(body)(2)@12f128b38 parent=12f128a78 {480,960,60480,3456} [state=0200020000100200] [content=12efe3160] [cs=10e9986b8]<
        line 12f129798: count=1 state=block,clean,prevmarginclean,not-impacted,not-wrapped,before:nobr,after:nobr[0x8] bm=960 {0,0,60480,3456} <
          Block(ul)(1)@12f128c48 parent=12f128b38 {0,0,60480,3456} [state=0300020000100210] [content=12f1b84c0] [cs=10e999a68]<
            line 12f1296a8: count=1 state=block,clean,prevmarginclean,not-impacted,not-wrapped,before:nobr,after:nobr[0x108] {2400,0,58080,1152} vis-overflow=1632,0,58848,1152 scr-overflow=1632,0,58848,1152 <
              Block(li)(1)@12f128d08 parent=12f128c48 next=12f1290b8 {2400,0,58080,1152} vis-overflow={-768,0,58848,1152} scr-overflow={-768,0,58848,1152} [state=0300020040100210] [content=12f1b8550] [cs=10e999b58]<
                line 12f129068: count=2 state=inline,clean,prevmarginclean,not-impacted,not-wrapped,before:nobr,after:nobr[0x500] {0,0,6133,1152} vis-overflow=-768,0,6932,1152 scr-overflow=-768,0,6901,1152 <
                  Text(0)"\n      "@12f128e78 parent=12f128d08 next=12f128f18 {0,816,0,0} [state=4000000028200000] [content=12f178d80] [cs=10e9a0208:-moz-text] [run=10e9b6b80][0,7,T] 
                  Inline(span)(1)@12f128f18 parent=12f128d08 {0,96,6133,960} vis-overflow={-30,0,6194,960} scr-overflow={0,0,6133,960} [state=0200000000000200] [content=12f1b85e0] [cs=10e999d38]<
                    Text(0)"hello I am a test"@12f128fb8 parent=12f128f18 {0,0,6133,960} vis-overflow={-30,0,6194,960} [state=02000000b0600000] [content=12f178e80] [cs=10e9a02f8:-moz-text] [run=10e9b6b80][0,17,T] 
                  >
                >
                BulletList 0x12f129058 <
                  Bullet(_moz_generated_content_marker)(-1)@12f128dc8 parent=12f128d08 {-768,438,768,378} [state=0300004000000040] [content=12f1b89d0] [cs=10e9a0118:marker]
                >
              >
            >
            line 12f1296f8: count=1 state=block,clean,prevmarginclean,not-impacted,not-wrapped,before:nobr,after:nobr[0x108] {2400,1152,58080,1152} vis-overflow=1632,1152,58848,1152 scr-overflow=1632,1152,58848,1152 <
              Block(li)(3)@12f1290b8 parent=12f128c48 next=12f129438 {2400,1152,58080,1152} vis-overflow={-768,0,58848,1152} scr-overflow={-768,0,58848,1152} [state=0300020040100210] [content=12f1b8670] [cs=10e999b58]<
                line 12f1293e8: count=1 state=block,clean,prevmarginclean,not-impacted,not-wrapped,before:nobr,after:nobr[0x8] {0,0,58080,1152} vis-overflow=-30,0,58110,1152 scr-overflow=0,0,58080,1152 <
                  Block(div)(1)@12f129228 parent=12f1290b8 {0,0,58080,1152} vis-overflow={-30,0,58110,1152} [state=0200020000100200] [content=12f1b8700] [cs=10e999e28]<
                    line 12f129388: count=1 state=inline,clean,prevmarginclean,not-impacted,not-wrapped,before:nobr,after:nobr[0x100] {0,0,6133,1152} vis-overflow=-30,0,6194,1152 scr-overflow=0,0,6133,1152 <
                      Text(0)"hello I am a test"@12f1292e8 parent=12f129228 {0,96,6133,960} vis-overflow={-30,0,6194,960} scr-overflow={0,0,6133,960} [state=02000000b0600000] [content=12f179080] [cs=10e9a03e8:-moz-text] [run=12f15c940][0,17,T] 
                    >
                  >
                >
                BulletList 0x12f1293d8 <
                  Bullet(_moz_generated_content_marker)(-1)@12f129178 parent=12f1290b8 {-768,438,768,378} [state=0300004000000040] [content=12f1b8a60] [cs=10e9a0118:marker]
                >
              >
            >
            line 12f129748: count=1 state=block,clean,prevmarginclean,not-impacted,not-wrapped,before:nobr,after:nobr[0x8] {2400,2304,58080,1152} vis-overflow=1632,2304,58848,1152 scr-overflow=1632,2304,58848,1152 <
              Block(li)(5)@12f129438 parent=12f128c48 {2400,2304,58080,1152} vis-overflow={-768,0,58848,1152} scr-overflow={-768,0,58848,1152} [state=0300020040100200] [content=12f1b8790] [cs=10e999c48]<
                line 12f129658: count=1 state=inline,clean,prevmarginclean,not-impacted,not-wrapped,before:nobr,after:nobr[0x500] {0,0,6133,1152} vis-overflow=-768,0,7171,1152 scr-overflow=-768,0,6901,1152 <
                  Text(0)"\n      hello I am a test\n    "@12f1295a8 parent=12f129438 {0,96,6133,960} vis-overflow={-30,0,6433,960} scr-overflow={0,0,6133,960} [state=02000000b0600000] [content=12f179200] [cs=10e9a05c8:-moz-text] [run=12f15ca00][0,29,T] 
                >
                BulletList 0x12f129648 <
                  Bullet(_moz_generated_content_marker)(-1)@12f1294f8 parent=12f129438 {-768,438,768,378} [state=0300000000000040] [content=12f1b8b80] [cs=10e9a04d8:marker]
                >
              >
            >
          >
        >
      >
    >
  >
>

Comment 9

[Morgan Reschenberg [:morgan]]

Attachment: edge_sample.png

Comment 10

[Morgan Reschenberg [:morgan]]

Hmm, seems like maybe my test case wasn't heading in the right direction; I've attached a sample of how it renders in edge (same, except edge also backplates bullet points). Based on the Bing/Engadget test cases which I was able to reproduce in nightly, I think this is fixed by the work in 1594099. If I moz-phab that patch and run the same sites, they look like the edge screenshots.
:asa, not sure of ettiquite here, should I keep trying to find a substantial test case or should I mark as resolved/duplicate of 1594099?

Comment 11

[Asa Dotzler [:asa]]

dupe it :)