New issue
Advanced search Search tips

Issue 829452 link

Starred by 2 users

Issue metadata

Status: Assigned
Owner:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux
Pri: 2
Type: Bug



Sign in to add a comment

Entering a class name with a period freezes parts of the style editor

Reported by valentin...@gmail.com, Apr 5 2018

Issue description

UserAgent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36

Steps to reproduce the problem:
1. Open DevTools
2. Select any element
3. Enter e.g. "color.: red" as a new property of element.style
4. Click on the property name to correct the typo

What is the expected behavior?
We can edit the property name, untick the checkbox, or remove the property.

What went wrong?
The property cannot be changed after it has been entered.

Did this work before? N/A 

Chrome version: 65.0.3325.181  Channel: stable
OS Version: Ubuntu 17.10
Flash Version: Shockwave Flash 29.0 r0

This happens whenever the property name contains a period, and only for properties of element.style, not other selectors. Sometimes (in my case always when I had switched back from another tab) other properties of element.style also became affected after some time.
 

Comment 1 by l...@chromium.org, Apr 5 2018

Owner: einbinder@chromium.org
Status: Assigned (was: Unconfirmed)
Thanks for the report!

Comment 2 by woxxom@gmail.com, Apr 5 2018

It's not really frozen. You can click another element, then select the original one - you'll see the invalid property is not listed in element styles. Devtools should probably use CSS.escape() internally to encode the property names like Firefox does.
It is really frozen for me. In the attached screen recording you can see how after entering the second, mis-typed property, I can't change it. This affects the third one as well, but not the first one. As soon as I edit the first property, the second is removed, and the value of the third is deleted.

I don't know why my mouse cursor looks different in the recording. You can see that it is slightly displaced; be assured that I did actually click the right element! I also couldn't figure out how to highlight clicks, but they should be audible anyway.
screen-recording4.webm
2.7 MB View Download

Sign in to add a comment