1387511 - CSS Grid Inspector: Negative Line Numbers are Incorrect (on Implicit Grid)

Status: RESOLVED FIXED

(DevTools :: Inspector, enhancement, P1)

Description

[Jen Simmons [:jensimmons]]

Let's take a third swing at getting the line number placements correct under all conditions. (Getting so close!)

This is correct:
example: https://s.codepen.io/jensimmons/debug/brBMPZ
screenshot: https://monosnap.com/file/ki9EO0d6fXtShPMsaeANJGO60gPxvi.png
whole test: https://codepen.io/jensimmons/pen/brBMPZ

Yay!

Now we just need to do the same thing in the other direction — so the negative numbers start in the bottom left corner of the explicit grid, not just in the bottom right corner. 

Here's an example to show what's wrong:
example: https://s.codepen.io/jensimmons/debug/GENbzL
screenshot w/ correct numbers marked in hot pink: https://monosnap.com/file/Nza2PPBLnUYOppoqTcYSaykxXljgrl.png
whole test: https://codepen.io/jensimmons/pen/GENbzL?editors=1100

It's confusing, I know. This is why developers are going to LOVE our tool. We confused ourselves so they don't have to.

Comment 1

[Jen Simmons [:jensimmons]]

It's *really* important that we fix this. We cannot ship negative line numbers until this is fixed. 

You can also look at this test page from Igalia to see the problem.
https://igalia.github.io/css-grid-layout/grid-placement.html

Screenshot marking up reality vs what would be correct: 
https://monosnap.com/file/cWm41umRR62Gf6U5JXFDySIEARCTOb.png

Comment 2

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1387511 - Part 1: Use the grid negative number platform API to render negative line numbers correctly in css grid inspector.

Review commit: https://reviewboard.mozilla.org/r/199298/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/199298/

Comment 3

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1387511 - Part 2: Format css-grid.js

Review commit: https://reviewboard.mozilla.org/r/199300/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/199300/

Comment 4

[Patrick Brosset <:pbro>]

Comment on attachment 8928066 [details]
Bug 1387511 - Part 1: Use the grid negative number platform API to render negative line numbers correctly in css grid inspector.

https://reviewboard.mozilla.org/r/199298/#review204474

Comment 5

[Patrick Brosset <:pbro>]

Comment on attachment 8928067 [details]
Bug 1387511 - Part 2: Format css-grid.js

https://reviewboard.mozilla.org/r/199300/#review204476

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/b0780ac4a74e
Part 1: Use the grid negative number platform API to render negative line numbers correctly in css grid inspector. r=pbro
https://hg.mozilla.org/integration/mozilla-inbound/rev/46a0be972d5a
Part 2: Format css-grid.js r=pbro

Comment 7

[Noemi Erli[:noemi_erli]]

https://hg.mozilla.org/mozilla-central/rev/b0780ac4a74e
https://hg.mozilla.org/mozilla-central/rev/46a0be972d5a