Closed Bug 1221238 Opened 7 years ago Closed 7 years ago
Devtools Filter Editor input fields get squashed / piled on top of, when preset list gets opened
STR: 1. Visit this data URL, or any page with a filter: data:text/html,<div style="filter:blur(1px)">InspectMe 2. Right-click the filtered thing ("InspectMe") and choose Inspect. 3. Click the filter editor icon in devtools inspector "Rules" view. 4. Click the presets button. (the 3 stacked squares at the bottom-right) ACTUAL RESULTS: (a) The "Preset Name" field doesn't fit -- it sticks off the right side. (b) When the presets pane slides in, the UI for editing the existing filters (the text-input field, the "x" button) get squashed / piled on top of each other. EXPECTED RESULTS: * Preset name field should be smaller (or flexible). * Input fields for existing fields shouldn't pile on top of themselves; they should be flexible. If this is all stuff in a flex container, it might be that we need some "min-width:auto" on some of this UI, to stifle an unreasonable "implied minimum size". (per bug 1043520)
I'm using the latest linux64 Nightly, btw: version 45.0a1 (2015-11-03)
(Also: my OS is Ubuntu 15.10.)
I can reproduce this bug in the latest Firefox DevEdition (/ Aurora) release, too -- 44.0a2 (2015-11-03)
Tested on linux and windows. I don't know exactly why, but <input /> seems to have a bigger minimal size on linux. Setting a smaller width fixes this, without actually resizing the input, flew-grow still takes the lead and ensure that the input takes the whole horizontal space.
Attachment #8683163 - Flags: review?(pbrosset)
Comment on attachment 8683163 [details] [diff] [review] patch v1 Review of attachment 8683163 [details] [diff] [review]: ----------------------------------------------------------------- Tested on all 3 platforms, looks good to me. Thanks for fixing this quickly Alex. We'll need to uplift this once it's on m-c (I'll keep track of this bug and request approval).
Attachment #8683163 - Flags: review?(pbrosset) → review+
[Tracking Requested - why for this release]: Ensure we uplift back to 44
Comment on attachment 8683163 [details] [diff] [review] patch v1 Approval Request Comment [Feature/regressing bug #]: Original bug was bug 1055181. This introduced a new tooltip in devtools to edit CSS Filter values more easily. This patch fixes the layout on Linux (input fields were too big). [User impact if declined]: If declined, the layout will feel partly broken to Linux users. This is especially important because the CSS Filter tooltip is one of the heavily marketed pieces of devtools in DevEd 44. [Describe test coverage new/current, TreeHerder]: Code is in m-c and manual tests have been done on all 3 platforms. There are no automated tests for the layout though (CSS-only). [Risks and why]: No crash risk with this patch. If this was to fail in any way, the only consequence would be on the size of the inputs in the CSS Filter tooltip. [String/UUID change made/needed]: None
Attachment #8683163 - Flags: approval-mozilla-aurora?
Comment on attachment 8683163 [details] [diff] [review] patch v1 This is the new stuff in DevEd44, let's uplift to Aurora.
Attachment #8683163 - Flags: approval-mozilla-aurora? → approval-mozilla-aurora+
7 years ago
Duplicate of this bug: 1221173
You need to log in before you can comment on or make changes to this bug.