New issue
Advanced search Search tips
Note: Color blocks (like █ or █) mean that a user may not be available. Tooltip shows the reason.

Issue 636089 link

Starred by 1 user
Status: Fixed
Owner:
█ lushnikov@chromium.org
Last visit 29 days ago
Closed: Oct 2016
Cc:
pfeldman@chromium.org
Components:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 2
Type: Feature



Sign in to add a comment

Please add autocomplete CSS classes like in firebug

Reported by harel.go...@gmail.com, Aug 9 2016 
UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36

Steps to reproduce the problem:
1. dev tools doesn't autocomplete css classes like firebug does.

What is the expected behavior?

What went wrong?
Please add this feature

Did this work before? N/A 

Chrome version: 52.0.2743.116  Channel: stable
OS Version: 10.0
Flash Version: Shockwave Flash 22.0 r0

Comment 1 by ligim...@chromium.org, Aug 9 2016

Labels: Needs-Bisect

Comment 2 by tkonch...@chromium.org, Aug 10 2016

Cc: pfeldman@chromium.org
Labels: -Type-Bug -Needs-Bisect M-54 Type-Feature
Status: Untriaged (was: Unconfirmed)
Confirming the issue a s this is a feature request. 
Waiting for more inputs on this

Comment 3 by kozyatinskiy@chromium.org, Aug 10 2016

Owner: lushnikov@chromium.org
Status: Assigned (was: Untriaged)

Comment 4 by lushnikov@chromium.org, Aug 11 2016 

Could you elaborate? Autocomplete css classes - where? What exactly do you expect?

Comment 5 by harel.go...@gmail.com, Aug 11 2016 

If you edit you site's css settings using chrome's inspect element, you need to manually type the css classes or IDs is you want target and override css settings.

In Firefox Firebug it is auto completing the css classes or IDs as you start typing it.

It would be very helpful if Google add this feature to their development tools in chrome.

Attached is a screenshot of what I mean.
firebug-auto-complete.jpg
266 KB View Download

Comment 6 by lushnikov@chromium.org, Aug 11 2016

Labels: -OS-Windows OS-All
Thank you for the details! Once this is implemented, it will also cover  issue 611749 .
Project Member

Comment 7 by bugdroid1@chromium.org, Sep 10 2016 

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/9f5d339452d3d4f76337ecb08e86227e13f15a79

commit 9f5d339452d3d4f76337ecb08e86227e13f15a79
Author: ahmetemiremir <ahmetemiremir@gmail.com>
Date: Sat Sep 10 00:34:11 2016

DevTools: Add features to collect classnames from Stylesheets and DOM

BUG= 636089 

Review-Url: https://codereview.chromium.org/2296323002
Cr-Commit-Position: refs/heads/master@{#417780}

[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/css/css-collect-class-names-expected.txt
[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/css/css-collect-class-names.html
[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/css/resources/collect-class-names-imported.css
[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/css/resources/collect-class-names.css
[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/dom/dom-collect-class-names-expected.txt
[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/dom/dom-collect-class-names.html
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorCSSAgent.cpp
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorCSSAgent.h
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorDOMAgent.cpp
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorDOMAgent.h
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorStyleSheet.cpp
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorStyleSheet.h
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/browser_protocol.json
Project Member

Comment 8 by bugdroid1@chromium.org, Sep 10 2016 

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/9f5d339452d3d4f76337ecb08e86227e13f15a79

commit 9f5d339452d3d4f76337ecb08e86227e13f15a79
Author: ahmetemiremir <ahmetemiremir@gmail.com>
Date: Sat Sep 10 00:34:11 2016

DevTools: Add features to collect classnames from Stylesheets and DOM

BUG= 636089 

Review-Url: https://codereview.chromium.org/2296323002
Cr-Commit-Position: refs/heads/master@{#417780}

[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/css/css-collect-class-names-expected.txt
[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/css/css-collect-class-names.html
[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/css/resources/collect-class-names-imported.css
[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/css/resources/collect-class-names.css
[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/dom/dom-collect-class-names-expected.txt
[add] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/LayoutTests/inspector-protocol/dom/dom-collect-class-names.html
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorCSSAgent.cpp
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorCSSAgent.h
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorDOMAgent.cpp
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorDOMAgent.h
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorStyleSheet.cpp
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/InspectorStyleSheet.h
[modify] https://crrev.com/9f5d339452d3d4f76337ecb08e86227e13f15a79/third_party/WebKit/Source/core/inspector/browser_protocol.json

Comment 9 by kavvaru@chromium.org, Sep 13 2016

Labels: Needs-Feedback
Tested the issue on windows 7 using chrome version 55.0.2859.0 with the below steps

1. Opened the URL http://getbootstrap.com/
2.Inspect element
3.selected one class element (ex::lead & bs-docs-masthead)
4.Start typing the class name not seeing any autocomplete suggestions for the class name.

Please find the attached screen cast and confirm anything missed here?

lushnikov@ Could you please provide us any test steps to verify the issue from test team end.

Thanks,
636089.mp4
1.7 MB View Download

Comment 11 by kayce@chromium.org, Oct 13 2016

Labels: DevTools-User-Facing

Comment 12 by lushnikov@chromium.org, Oct 28 2016

Status: Fixed (was: Assigned)

Comment 13 by harel.go...@gmail.com, Aug 20 2017 

I'm sorry, but this issue is not resolved.
Please note, there is no autocomplete of CSS classes/DOM elements on chrome dev tools.

Please resolve this issue.

Comment 14 by harel.go...@gmail.com, Aug 20 2017 

What I mean is autocomplete as you type the element's class name / DOM element.
►

Sign in to add a comment