Bug 271403 – Web Inspector: Glitches when trying to edit a style from a style sheet that has an @import statement

• Component: Web Inspector
• Status: RESOLVED FIXED

[Qianlang Chen]

Created attachment 470466 [details]
Reduced test case: host the webpage and open it to see instructions

If a style sheet A `@import`s another style sheet B, using the inspector's style details panel to edit a style from sheet A glitches and removes the style immediately.

For instance, let's say in style sheet A you have:
    @import url("style-sheet-B.css");
    body {
        font-family: sans-serif;
    }

Then when you try to edit the font-family style from the details panel, the inspector suddenly removes the font-family style altogether.

See attached for a downloadable test case.

[Radar WebKit Bug Importer]

<rdar://problem/125185110>

[Qianlang Chen]

Created attachment 470468 [details]
Video demo: editing font-family causes the glitch

Possible related bug around editing styles involving @import: https://webkit.org/b/271402

[Qianlang Chen]

See also rdar://118919870.

[EWS]

Committed 283950@main (227d5b5816c0): <https://commits.webkit.org/283950@main>

Reviewed commits have been landed. Closing PR #32260 and removing active labels.

[EWS]

Committed 283286.487@safari-7620-branch (250da3ba3c5d): <https://commits.webkit.org/283286.487@safari-7620-branch>

Reviewed commits have been landed. Closing PR #2295 and removing active labels.