1298669 - innerText doesn't consider <p> tags to be linebreaks when used with synthetic documents

Status: NEW

(Core :: DOM: Core & HTML, defect, P3)

Description

[Manish Goregaokar [:manishearth]]

Attachment: testcase.html

If you have some elements separated by <p> tags, innerText on their container will show those tags as linebreaks. This is correct -- innerText is supposed to be what you get when the user selects and copies the node.

However, if this same thing happens in a synthetically constructed Document (i.e, via `xhr.responseType = "document"`), these linebreaks disappear.

For the attached testcase, Chrome behaves the same way firefox does. But for more complex cases like the `syntaxbox` element in https://developer.mozilla.org/en-US/docs/Web/CSS/clip-path, Chrome includes some line breaks, and Firefox strips all of them out (when fetched).

Not sure if this is a bug at all, though.

Comment 1

[Hsin-Yi Tsai (she/her) [:hsinyi]]

Hi John, could you please take a look?

Comment 2

[John Dai[:jdai]]

Manish, could you provide a simple testcase to reproduce the issue?

Comment 3

[Manish Goregaokar [:manishearth]]

The attached testcase works already? It fetches itself over XHR and compares the innerText of the current and fetched document.

Comment 4

[John Dai[:jdai]]

Attachment: test_1298669.html

(In reply to Manish Goregaokar [:manishearth] from comment #3)
> The attached testcase works already? It fetches itself over XHR and compares
> the innerText of the current and fetched document.

Yes, I tweaked your testcase a little bit and it works on the first case, it shows "Fetched innerText: abc" both in chrome and firefox.
However, I had a hard time to reproduce the second one, which is 

> But for more complex cases like the `syntaxbox` element in 
> https://developer.mozilla.org/en-US/docs/Web/CSS/clip-path, 
> Chrome includes some line breaks, and Firefox strips all of them out (when fetched).

Hence, could you provide a simple testcase to reproduce this issue? Thank you.

Comment 5

[Manish Goregaokar [:manishearth]]

Running

`xhr = new XMLHttpRequest(); xhr.responseType="document"; xhr.open("GET", ""); xhr.send(null); xhr.onloadend = function() {console.log("Remote: " + xhr.response.querySelector('pre.syntaxbox').innerText)}; console.log("Local: " + document.querySelector('pre.syntaxbox').innerText)`

in the console for https://developer.mozilla.org/en-US/docs/Web/CSS/clip-path works and shows the discrepancy.


Not yet sure how to reduce that testcase, will look at later.

Comment 6

[John Dai[:jdai]]

(In reply to Manish Goregaokar [:manishearth] from comment #5)
> Running
> 
> `xhr = new XMLHttpRequest(); xhr.responseType="document"; xhr.open("GET",
> ""); xhr.send(null); xhr.onloadend = function() {console.log("Remote: " +
> xhr.response.querySelector('pre.syntaxbox').innerText)}; console.log("Local:
> " + document.querySelector('pre.syntaxbox').innerText)`
> 
> in the console for
> https://developer.mozilla.org/en-US/docs/Web/CSS/clip-path works and shows
> the discrepancy.
> 
> 
> Not yet sure how to reduce that testcase, will look at later.

If you can give me whole piece of html test file that would be nice. After I looked at your comment, I can't figure out 'pre.syntaxbox'.

Comment 7

[John Dai[:jdai]]

Hi :manishearth,
It's just a gentle ping, could you upload your test file? Thank you.

Comment 8

[Manish Goregaokar [:manishearth]]

Attachment: testcase_with_pre

Comment 9

[Manish Goregaokar [:manishearth]]

Attachment: testcase_with_pre

Comment 10

[Manish Goregaokar [:manishearth]]

Attachment: testcase_with_p_br

It seems to happen with <br> tags inside <p> tags.

Both Chrome and Firefox output 

> Local: line 1
> line 2
> 
> line 3

but for Remote Chrome outputs

> Remote: line 1
>  line 2line 3

and Firefox outputs

> Remote: line 1 line 2line 3

Both are wrong, though Firefox strips out both <br> and <p> whereas Chrome only strips out <p>