830324 - Show a border around the textbox when editing values in the Variables View

Status: RESOLVED FIXED

(DevTools :: Debugger, defect, P3)

Description

[Victor Porof [:vporof][:vp]]

Mihai pointed out today that entering "edit mode" (when clicking on a variable or property value) isn't always obvious just by showing a selection.

Comment 1

[Victor Porof [:vporof][:vp]]

Attachment: v1

UL IS HARD.

Comment 2

[Mihai Sucan [:msucan]]

Comment on attachment 707700 [details] [diff] [review]
v1

Review of attachment 707700 [details] [diff] [review]:
-----------------------------------------------------------------

Much better. Thank you!

::: browser/devtools/shared/VariablesView.jsm
@@ +2230,5 @@
> +    // Can't use clientWidth because labels may have extra unnecessary padding.
> +    let style = this.window.getComputedStyle(aLabel);
> +    input.width = (parseInt(style.getPropertyValue("width")) ||
> +      ELEMENT_INPUT_DEFAULT_WIDTH) + // No content previously available.
> +      ELEMENT_INPUT_EXTRA_SPACE; // Extra space added for editing.

Why  do you need to set the input width and all this trouble?

Comment 3

[Mihai Sucan [:msucan]]

(In reply to Victor Porof [:vp] from comment #1)
> Created attachment 707700 [details] [diff] [review]
> v1
> 
> XUL IS HARD.

I KNOW.

Comment 4

[Victor Porof [:vporof][:vp]]

(In reply to Mihai Sucan [:msucan] from comment #2)
> Comment on attachment 707700 [details] [diff] [review]
> v1
> 
> Review of attachment 707700 [details] [diff] [review]:
> -----------------------------------------------------------------
> 
> Much better. Thank you!
> 
> ::: browser/devtools/shared/VariablesView.jsm
> @@ +2230,5 @@
> > +    // Can't use clientWidth because labels may have extra unnecessary padding.
> > +    let style = this.window.getComputedStyle(aLabel);
> > +    input.width = (parseInt(style.getPropertyValue("width")) ||
> > +      ELEMENT_INPUT_DEFAULT_WIDTH) + // No content previously available.
> > +      ELEMENT_INPUT_EXTRA_SPACE; // Extra space added for editing.
> 
> Why  do you need to set the input width and all this trouble?

Because the input doesn't initially exist. The value is shown as a label, then on click replaceChild with the textbox. Since that has an arbitrary default width (useful shit right there!), you'll need to manually calculate all this.

Comment 5

[Victor Porof [:vporof][:vp]]

https://hg.mozilla.org/integration/fx-team/rev/73ccb94a810d

Comment 6

[Tim Taubert [:ttaubert] (inactive)]

https://hg.mozilla.org/mozilla-central/rev/73ccb94a810d