Edit and Resend layout is broken
Categories
(DevTools :: Netmonitor, defect, P2)
Tracking
(firefox-esr91 unaffected, firefox-esr102 unaffected, firefox103 unaffected, firefox104 fixed, firefox105 fixed)
Tracking | Status | |
---|---|---|
firefox-esr91 | --- | unaffected |
firefox-esr102 | --- | unaffected |
firefox103 | --- | unaffected |
firefox104 | --- | fixed |
firefox105 | --- | fixed |
People
(Reporter: jdescottes, Assigned: jdescottes)
References
(Regression)
Details
(Keywords: regression)
Attachments
(1 file)
48 bytes,
text/x-phabricator-request
|
diannaS
:
approval-mozilla-beta+
|
Details | Review |
Not sure yet what happened but Edit and Resend's layout is fully broken. Probably regressed by Bug 1779972?
STRs:
- open DevTools > Network for any tab
- perform a navigation so that you have at least one request listed in the Network panel
- right click on one of the requests and select "Resend"
ER: the "headers" section of the UI which appeared should be a table with two columns (header name, header value)
AR: the "headers" section is visibly broken.
Assignee | ||
Comment 1•2 years ago
|
||
Looks like when turning some duplicated ids into classnames for https://hg.mozilla.org/integration/autoland/rev/39969dab34cb it shuffled CSS selector priorities....
Updated•2 years ago
|
Assignee | ||
Comment 2•2 years ago
|
||
The flex-wrap rule no longer had higher specificity than
.network-monitor .tabpanel-summary-container {
flex-wrap: wrap;
padding-inline-start: 4px;
margin-bottom: 5px;
}
Which broke the layout.
https://searchfox.org/mozilla-central/rev/2bbb0c0a90df20702df8c8011a8996536a83cb75/devtools/client/netmonitor/src/assets/styles/HeadersPanel.css#166
I am adding a ".network-monitor" to selectors for which I started using a class instead of an ID.
Comment 3•2 years ago
|
||
Set release status flags based on info from the regressing bug 1779972
Assignee | ||
Comment 4•2 years ago
|
||
Comment on attachment 9287527 [details]
Bug 1782077 - [devtools] Restore CSS specificity for Edit And Resend headers
Beta/Release Uplift Approval Request
- User impact if declined: DevTools > Netmonitor > resend UI looks unusable
This regression was caused by the last patch from the regressing bug. It should have been a completely transparent cleanup, so I didn't test it before landing. But as it happens switching a specific element id (which were duplicated and therefore incorrect) to a className lead to lower the specificity of the CSS rules relying on this id.
- Is this code covered by automated tests?: No
- Has the fix been verified in Nightly?: No
- Needs manual test from QE?: No
- If yes, steps to reproduce:
- List of other uplifts needed: None
- Risk to taking this patch: Low
- Why is the change risky/not risky? (and alternatives if risky): Overall the patch here is very small, we just increase the specificity of the impacted selectors in one devtools CSS file, which is only used when opening the edit and resend panel for the DevTools netmonitor.
- String changes made/needed:
- Is Android affected?: Yes
Pushed by jdescottes@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/748aa8332f69 [devtools] Restore CSS specificity for Edit And Resend headers r=nchevobbe
Comment 6•2 years ago
|
||
bugherder |
Comment 7•2 years ago
|
||
Comment on attachment 9287527 [details]
Bug 1782077 - [devtools] Restore CSS specificity for Edit And Resend headers
Approved for 104.0b5
Comment 8•2 years ago
|
||
bugherder uplift |
Description
•