Bug 95722

Summary:

Web Inspector: [Elements] Sidebar panes not updated on style changes due to "class" attribute modifications

Product:

WebKit

Reporter:

Alexander Pavlov (apavlov) <apavlov>

Component:

Web Inspector (Deprecated)

Assignee:

Alexander Pavlov (apavlov) <apavlov>

Status:

RESOLVED FIXED

Severity:

Normal

CC:

apavlov, bweinstein, joepeck, keishi, loislo, pfeldman, pmuellr, rik, timothy, yurys

Priority:

Version:

528+ (Nightly build)

Hardware:

All

OS:

All

Attachments:

Description	Flags
Patch	none
Patch	none
Patch	none
Patch	none
Patch	vsevik: review+

Alexander Pavlov (apavlov)

Reported 2012-09-04 02:32:17 PDT

What steps will reproduce the problem? 1. Save the following as .html 2. inspect the first td in the table 3. note the color in the styles side panel 4. click on the page 5. Note the color of the td changes, but the Styles side panel does not update. Bug. 6. click in the Elements panel on the selected td element, note that the Styles UI still does not update. Bug. Firebug updates at step #5, so #6 does not matter for it. <head> <style> .row-open > td:first-child{ background-color: red; } .row-closed > td:first-child{ background-color: green; } </style> <script> function swap() { var opens = document.querySelectorAll('.row-open'); var closeds = document.querySelectorAll('.row-closed'); for(var i = 0; i < opens.length; i++) { opens[i].classList.remove("row-open"); opens[i].classList.add("row-closed"); } for(var i = 0; i < closeds.length; i++) { closeds[i].classList.remove("row-closed"); closeds[i].classList.add("row-open"); } } function onLoad() { document.body.addEventListener('click', swap); } window.addEventListener('load', onLoad); </script> </head> <body> <table> <tbody> <tr class="row-open"> <td>1st</td> <td>2nd</td> <td>3rd</td> </tr> <tr class="row-closed"> <td>1st</td> <td>2nd</td> <td>3rd</td> </tr> </tbody> </table> </body> Upstreaming http://code.google.com/p/chromium/issues/detail?id=145348

Attachments
Patch (9.05 KB, patch) 2012-09-04 03:58 PDT, Alexander Pavlov (apavlov)	no flags	Details Formatted Diff Diff
Patch (10.38 KB, patch) 2012-09-04 06:40 PDT, Alexander Pavlov (apavlov)	no flags	Details Formatted Diff Diff
Patch (20.16 KB, patch) 2012-09-10 07:37 PDT, Alexander Pavlov (apavlov)	no flags	Details Formatted Diff Diff
Patch (20.44 KB, patch) 2012-09-12 02:23 PDT, Alexander Pavlov (apavlov)	no flags	Details Formatted Diff Diff
Patch (20.44 KB, patch) 2012-09-12 03:44 PDT, Alexander Pavlov (apavlov)	vsevik: review+	Details Formatted Diff Diff
Show Obsolete (4) View All Add attachment proposed patch, testcase, etc.

Alexander Pavlov (apavlov)

Comment 1 2012-09-04 03:58:02 PDT

Created attachment 162002 [details] Patch

Vsevolod Vlasov

Comment 2 2012-09-04 05:35:15 PDT

Comment on attachment 162002 [details] Patch So how would we deal with the following cases? - other attributes modifications (affects attribute selector [], id selector #) - attribute removals (removed and modified event are separated) - sibling selectors - pseudo-class selectors could be affected by node removing/adding

Alexander Pavlov (apavlov)

Comment 3 2012-09-04 06:40:31 PDT

Created attachment 162032 [details] Patch

Alexander Pavlov (apavlov)

Comment 4 2012-09-10 07:37:07 PDT

Created attachment 163127 [details] Patch

Alexander Pavlov (apavlov)

Comment 5 2012-09-12 02:23:57 PDT

Created attachment 163554 [details] Patch

Vsevolod Vlasov

Comment 6 2012-09-12 03:28:51 PDT

Comment on attachment 163554 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=163554&action=review > Source/WebCore/inspector/front-end/StylesSidebarPane.js:331 > + return !this.node || this.node === node || node.parentNode === this.node.parentNode || node.isAncestor(this.node); How can it affect style when there is no current node? See first or operand.

Alexander Pavlov (apavlov)

Comment 7 2012-09-12 03:36:38 PDT

(In reply to comment #6) > (From update of attachment 163554 [details]) > View in context: https://bugs.webkit.org/attachment.cgi?id=163554&action=review > > > Source/WebCore/inspector/front-end/StylesSidebarPane.js:331 > > + return !this.node || this.node === node || node.parentNode === this.node.parentNode || node.isAncestor(this.node); > > How can it affect style when there is no current node? See first or operand. This is the case when there is no selected node, so I decided to be on the safe side. I can, however, invert this check, so that this.node is required to be present in order to be affected by a change.

Alexander Pavlov (apavlov)

Comment 8 2012-09-12 03:44:36 PDT

Created attachment 163573 [details] Patch

Alexander Pavlov (apavlov)

Comment 9 2012-09-12 04:35:56 PDT

Committed r128291: <http://trac.webkit.org/changeset/128291>

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