Nested widget hover css selects all children

[Rycochet]

Steps to reproduce

1. Create a widget.
2. Place several widgets inside.
3. Hover mouse over outer widget - all nested widgets get a yellow outline.

Expected result

Only the widgets being hovered over should get an outline.

Actual result

All children of the outermost widget get highlighted.

Other details (browser, OS, CKEditor version, installed plugins)

n/a

Fix

Currently the following css gets added to the page -

.cke_widget_wrapper:hover .cke_widget_editable {
	outline: 2px solid yellow;
}

Changing it to this fixes the issue -

.cke_widget_wrapper:hover > .cke_widget_editable {
	outline: 2px solid yellow;
}

[Jakub Ś]

I can't confirm that. I have tried default full package with mathjax, simplebox and image2. I have placed image2 and mathjax inside simple box, unfocused all widgets (also tried with focus) and then hovered outer widget.
Result: Only outer widget is outlined.

Tested in FF, Chrome and IE.

---

1. With what widgets are you able to reproduce it?
2. Are you able to reproduce it in default preset or only inside some customized one with third-party plugins and core code modifications?

[Rycochet]

It's very specific to editable widgets within other custom editable widgets (in this case I've got a lot of them - and there's only a couple that aren't editable).

Unless you're testing something like a SimpleBox inside another SimpleBox it won't show up - the other widgets you mentioned don't actually have the "cke_widget_editable" class.

The specific line in the code is here - ​https://github.com/ckeditor/ckeditor-dev/blob/bd5101a8c6f7cee68895f751959848104adfe340/plugins/widget/plugin.js#L33 - all of the other hover lines in there specifically use the > child selector.

Standard CKEditor (hence the source link above) ;-)

[Jakub Ś]

I have set simplebox content area ACF rules to allowedContent: '' and tested this again.

I can't confirm that widget gets focused but its editables sure are (please see attached image).
I agree that it would be much better if only outer widget gets outlined if it is hovered and is nested widgets are left untouched.

NOTE: This happens also the other way around. Hovering nested widget results in outer widget editables to get outlined. This case is valid IMO because you are in fact hovering outer widget as well.