Reporter@ Thanks for filing the issue, could you please provide us with a sample test case file to test this issue from Chrome-TE end?

Thanks!

File attached.  Having looked further I can see what is happening now and it seems like more of a simple non-intuitive interface issue. Basically:

1) Double clicking on a tag name in the DOM inspector and then pressing the right arrow key and entering a space character make it feel like you can then add parameters such as class names and ids and style etc. In fact you are simply editing the class name, which fails when you enter lots of gloop that is invalid for class names.

2) If, rather than double clicking on the tag name and hitting the right arrow key to get the caret where you want it, you instead double click on the tag name and THEN single click on the right closing angle bracket, you get put into the mode where you can edit parameters such as class names etc.

3) The behaviour I reported is then basically you editing the tag name, the edit failing / silently discarding your corrupted tag name, and then popping you along to the parameter editing box, where your second attempt then succeeds as your are now starting off in the right editing box.

4) This only shows up when you edit tags which have no parameters. When tags have parameters you naturally click somewhere in that area and not on the tag name to initiate editing.

Deleted: sample.html 837 bytes

sample.html 837 bytes View Download

Thank you for providing more feedback. Adding requester "brajkumar@chromium.org" to the cc list and removing "Needs-Feedback" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot

(re: my comment above)

Sorry, Paragraph 1 should read:

1) Double clicking on a tag name in the DOM inspector and then pressing the right arrow key and entering a space character make it feel like you can then add parameters such as class names and ids and style etc. In fact you are simply editing the TAG name, which fails when you enter lots of gloop that is invalid for TAG names.

Reproduced this on 59.0.3045.0 (Developer Build) (64-bit). I agree it's non-intuitive.

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

commit eee703e7951bd989052d3d5bb326baa465863a51
Author: Joel Einbinder <einbinder@chromium.org>
Date: Tue Mar 27 03:24:42 2018

DevTools: Commit tag name editing on Space

When editing the tag of an Element, the user pressing space indicates
that they want to move on to editing an attribute. We have similar logic
in the StylesSidebar when the user presses : or ;.

Bug: 701336
Change-Id: Ib087a6e5a898ba9fb7c599f3d60ef3126ce66f4e
Reviewed-on: https://chromium-review.googlesource.com/976816
Reviewed-by: Andrey Lushnikov <lushnikov@chromium.org>
Commit-Queue: Joel Einbinder <einbinder@chromium.org>
Cr-Commit-Position: refs/heads/master@{#545961}
[modify] https://crrev.com/eee703e7951bd989052d3d5bb326baa465863a51/third_party/WebKit/Source/devtools/front_end/elements/ElementsTreeElement.js

> Able to reproduce this issue on chrome latest stable #65.0.3325.181

> Verified this issue after fix on Ubuntu 14.04 and Mac OS 10.13.3 using chrome latest canary #67.0.3382.0 by following test case provided in comment #3. Observed able to add "class=xx" to table at first attempt as expected. Hence adding TE-Verified label for M67. 

Thanks!