| Summary: | Align "UA" stylesheet for "hr", "fieldset", "marquee", "details" etc. with HTML Spec | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Ahmad Saleem <ahmad.saleem792> |
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED FIXED | ||
| Severity: | Normal | CC: | karlcow, webkit-bug-importer |
| Priority: | P2 | Keywords: | BrowserCompat, InRadar |
| Version: | Safari Technology Preview | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
| See Also: |
https://bugs.webkit.org/show_bug.cgi?id=157323 https://bugs.webkit.org/show_bug.cgi?id=245160 https://bugs.webkit.org/show_bug.cgi?id=245159 https://bugs.webkit.org/show_bug.cgi?id=245174 https://bugs.webkit.org/show_bug.cgi?id=172801 |
||
|
Description
Ahmad Saleem
2022-09-13 12:54:18 PDT
For reference ================================= WebKit https://searchfox.org/wubkat/source/Source/WebCore/css/html.css marquee { display: inline-block; } hr { display: block; margin-block-start: 0.5em; margin-block-end: 0.5em; margin-inline-start: auto; margin-inline-end: auto; border-style: inset; border-width: 1px; } fieldset { display: block; margin-inline-start: 2px; margin-inline-end: 2px; padding-block-start: 0.35em; padding-inline-start: 0.75em; padding-inline-end: 0.75em; padding-block-end: 0.625em; border: 2px groove ThreeDFace; min-width: min-content; } ================================= Blink https://github.com/chromium/chromium/blob/main/third_party/blink/renderer/core/html/resources/html.css marquee { display: inline-block; width: -webkit-fill-available; } hr { display: block; overflow: hidden; unicode-bidi: isolate; margin-block-start: 0.5em; margin-block-end: 0.5em; margin-inline-start: auto; margin-inline-end: auto; border-style: inset; border-width: 1px } fieldset { display: block; margin-inline-start: 2px; margin-inline-end: 2px; padding-block-start: 0.35em; padding-inline-start: 0.75em; padding-inline-end: 0.75em; padding-block-end: 0.625em; border: 2px groove #C0C0C0; min-inline-size: min-content; } ================================= Gecko https://searchfox.org/mozilla-central/source/layout/style/res/html.css marquee { inline-size: -moz-available; display: inline-block; vertical-align: text-bottom; text-align: start; } marquee:is([direction="up"], [direction="down"]) { block-size: 200px; } /* <hr> noshade and color attributes are handled completely by * HTMLHRElement::MapAttributesIntoRule. * https://html.spec.whatwg.org/#the-hr-element-2 */ hr { color: gray; border-width: 1px; border-style: inset; margin-block-start: 0.5em; margin-block-end: 0.5em; margin-inline-start: auto; margin-inline-end: auto; overflow: hidden; /* FIXME: This is not really per spec */ display: block; } hr[size="1"] { border-style: solid none none none; } For details and summary it will be slightly complex, because there are specific behaviors associated to this. See Bug 157323 I have the feeling that would be probably addressing each of them separately instead of one single PR. (In reply to Karl Dubost from comment #1) > For reference > > ================================= > WebKit > https://searchfox.org/wubkat/source/Source/WebCore/css/html.css > > marquee { > display: inline-block; > } > > hr { > display: block; > margin-block-start: 0.5em; > margin-block-end: 0.5em; > margin-inline-start: auto; > margin-inline-end: auto; > border-style: inset; > border-width: 1px; > } > > fieldset { > display: block; > margin-inline-start: 2px; > margin-inline-end: 2px; > padding-block-start: 0.35em; > padding-inline-start: 0.75em; > padding-inline-end: 0.75em; > padding-block-end: 0.625em; > border: 2px groove ThreeDFace; > min-width: min-content; > } > > > ================================= > Blink > https://github.com/chromium/chromium/blob/main/third_party/blink/renderer/ > core/html/resources/html.css > > marquee { > display: inline-block; > width: -webkit-fill-available; > } > > hr { > display: block; > overflow: hidden; > unicode-bidi: isolate; > margin-block-start: 0.5em; > margin-block-end: 0.5em; > margin-inline-start: auto; > margin-inline-end: auto; > border-style: inset; > border-width: 1px > } > > fieldset { > display: block; > margin-inline-start: 2px; > margin-inline-end: 2px; > padding-block-start: 0.35em; > padding-inline-start: 0.75em; > padding-inline-end: 0.75em; > padding-block-end: 0.625em; > border: 2px groove #C0C0C0; > min-inline-size: min-content; > } > > > ================================= > Gecko > https://searchfox.org/mozilla-central/source/layout/style/res/html.css > > marquee { > inline-size: -moz-available; > display: inline-block; > vertical-align: text-bottom; > text-align: start; > } > > marquee:is([direction="up"], [direction="down"]) { > block-size: 200px; > } > > /* <hr> noshade and color attributes are handled completely by > * HTMLHRElement::MapAttributesIntoRule. > * https://html.spec.whatwg.org/#the-hr-element-2 > */ > hr { > color: gray; > border-width: 1px; > border-style: inset; > margin-block-start: 0.5em; > margin-block-end: 0.5em; > margin-inline-start: auto; > margin-inline-end: auto; > overflow: hidden; > > /* FIXME: This is not really per spec */ > display: block; > } > > hr[size="1"] { > border-style: solid none none none; > } > > > For details and summary it will be slightly complex, because there are > specific behaviors associated to this. See Bug 157323 > > I have the feeling that would be probably addressing each of them separately > instead of one single PR. Yes - I have already created separate bugs for "fieldset" and "marquee", will ignore "details and summary" for now but will try to do "hr" but I noticed that there were a lot of failures let's see. I tried to land this in one go but failed so I did split patches: PR of failed attempt for reference: https://github.com/WebKit/WebKit/pull/4327 I am able to do changes for 'fieldset' and 'marquee' - please refer to 'See Also' section. ___ Learning: 'hr' element change is troublesome because it leads to "render" layer being added and had to re baseline 200+ tests. Although rebaselining is not the difficult part: -> on 'win' bot, it leads to change in outline color being changed from 'blue' to 'black' and I don't know how to fix it. -> on some WPT test cases in 'SELECTION', we start to fail them and they time out. Although it leads to some passes as well. ___ For Details & Summary - I will try to land them in separate during this week without 'list-item' to see at least, it works for remaining cases. Thanks! Ahmad, > 'hr' element change is troublesome because it leads to "render" layer being added and had to re baseline 200+ tests. the HR patch has been landed. https://github.com/WebKit/WebKit/pull/4724 (In reply to Karl Dubost from comment #5) > Ahmad, > > > 'hr' element change is troublesome because it leads to "render" layer being added and had to re baseline 200+ tests. > > the HR patch has been landed. > https://github.com/WebKit/WebKit/pull/4724 Yes - I think we can close this bug since now pretty much everything is done here except details, which is dependent on bug 157323. |