1442192 - different lines in css in compare to chrome

Status: RESOLVED WONTFIX

(DevTools :: Inspector, defect)

Description

[Eugen Konkov]

Attachment: delete1.jpg

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:58.0) Gecko/20100101 Firefox/58.0
Build ID: 20180209193630

Steps to reproduce:

I view computed style for the element



Actual results:

chrome and FF show different results


Expected results:

I think results should be same. The difference is because Chrome count lines where css definition ends, FF - where starts (FF does right thing, I think)

Just pay attention for this.

Comment 1

[Hani Yacoub, Desktop QA]

Hi Eugen, Could you please provide a link to the page you are using? It could help us with the investigation.
Thanks.

Comment 2

[Hani Yacoub, Desktop QA]

Closing as Resolved:Incomplete due to no update from reporter. Please feel free to reopen the bug if issue still exists for you even with fresh profile and safe mode.

Comment 3

[Eugen Konkov]

https://web.feel-safe.net/v2/css/layout.css

Comment 4

[Eugen Konkov]

Attachment: the target page

Comment 5

[Eugen Konkov]

Attachment: dev tools display different lines for same styling

Comment 6

[Hani Yacoub, Desktop QA]

I couldn't reproduce it using many websites. It might be happening on certain ones.
I'll set this to a "css parsing and computation" component.

Comment 7

[Emilio Cobos Álvarez [:emilio]]

(In reply to Eugen Konkov from comment #0)
> I think results should be same. The difference is because Chrome count lines
> where css definition ends, FF - where starts (FF does right thing, I think)
> 
> Just pay attention for this.

Why is this wrong? We don't need to necessarily do the same thing as Chrome :)

In any case this is a DevTools thing. Changing this may require CSS changes, but that's another issue.

Comment 8

[Patrick Brosset <:pbro>]

This is indeed a DevTools thing, but I don't feel strongly about fixing it. Both Firefox and Chrome are correct. As you said in comment 0, Chrome gives you the line where the set of declarations start (i.e. where the { character is found), while Firefox gives you the line where the rule starts (i.e. where the selector starts).

For example, here's a test URL you can load in Chrome and Firefox that contains a CSS rule spread over a few lines:
data:text/html,<style>html,%0Abody%0A{%0Acolor:red;%0A}</style>test

If you open the Inspector and look in the CSS Rules sidebar, you'll see that Chrome says that the rule is on line 3 (where the { is), while Firefox says the rule is on line 1 (where the selector starts).

I don't think there is a compelling reason here to do one way or the other, so I'll WONTFIX this bug for now.
Please let me know if there's an important use case that providing the same line number would solve.