Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Support <div align="..."> and <center> in block layout #31423

Merged
merged 1 commit into from Feb 26, 2024
Merged

Support <div align="..."> and <center> in block layout #31423

merged 1 commit into from Feb 26, 2024

Conversation

Loirooriol
Copy link
Contributor

As per HTML [1], <div align="..."> and <center> should align descendants to the left/center/right. This is similar to having 'auto' margins [2], but without changing their used values [3].

[1]: https://html.spec.whatwg.org/multipage/rendering.html#flow-content-3
[2]: https://html.spec.whatwg.org/multipage/rendering.html#align-descendants
[3]: whatwg/html#10149

  • ./mach build -d does not report any errors
  • ./mach test-tidy does not report any errors
  • There are tests for these changes

@Loirooriol Loirooriol added A-layout/block A-layout/2020 https://github.com/servo/servo/wiki/Layout-2020 T-linux-wpt-2020 Do a try run of the WPT labels Feb 23, 2024
@github-actions github-actions bot removed the T-linux-wpt-2020 Do a try run of the WPT label Feb 23, 2024
@github-actions GitHub Actions
Copy link

🔨 Triggering try run (#8025114376) for Linux WPT

@github-actions GitHub Actions
Copy link

Test results for linux-wpt-layout-2020 from try job (#8025114376):

Flaky unexpected result (13)
  • TIMEOUT [expected OK] /_webgl/conformance/glsl/misc/shader-with-non-reserved-words.html (#16216)
    • NOTRUN [expected PASS] subtest: Overall test
  • TIMEOUT [expected OK] /_webgl/conformance/uniforms/out-of-bounds-uniform-array-access.html (#26225)
    • NOTRUN [expected PASS] subtest: Overall test
  • OK /html/browsers/browsing-the-web/navigating-across-documents/empty-iframe-load-event.html (#29066)
    • FAIL [expected PASS] subtest: Check execution order from nested timeout assert_equals: Expected nested setTimeout to run second expected true but got false
    • FAIL [expected PASS] subtest: Check execution order on load handler assert_equals: Expected onload to run first expected false but got true
  • OK /html/browsers/browsing-the-web/navigating-across-documents/navigation-unload-cross-origin.sub.window.html (#29056)
    • PASS [expected FAIL] subtest: Cross-origin navigation started from unload handler must be ignored
  • OK /html/browsers/browsing-the-web/navigating-across-documents/navigation-unload-same-origin.window.html (#29049)
    • PASS [expected FAIL] subtest: Same-origin navigation started from unload handler must be ignored
  • OK [expected TIMEOUT] /html/interaction/focus/the-autofocus-attribute/supported-elements.html (#24145)
    • FAIL [expected TIMEOUT] subtest: Host element with delegatesFocus including no focusable descendants should be skipped promise_test: Unhandled rejection with value: object "TypeError: host.attachShadow is not a function"
    • FAIL [expected NOTRUN] subtest: Area element should support autofocus assert_equals: expected Element node <area></area> but got Element node <body>
      <img src="/media/poster.png" usemap="#map">
      <map n...
  • OK /html/semantics/embedded-content/the-img-element/non-active-document.html (#21544)
    • FAIL [expected PASS] subtest: DOMParser assert_unreached: got unexpected load event Reached unreachable code
    • FAIL [expected PASS] subtest: createHTMLDocument assert_unreached: got unexpected error event Reached unreachable code
    • FAIL [expected PASS] subtest: <template> assert_unreached: got unexpected error event Reached unreachable code
  • TIMEOUT [expected PASS] /html/semantics/forms/the-select-element/select-attribute-crash.html
  • TIMEOUT [expected PASS] /html/semantics/interactive-elements/the-details-element/auto-expand-ax-slot-recalc-crash.html
  • TIMEOUT /resource-timing/test_resource_timing.html (#25720)
    • PASS [expected FAIL] subtest: PerformanceEntry has correct name, initiatorType, startTime, and duration (img)
  • TIMEOUT [expected OK] /url/failure.html (#28574)
  • OK [expected TIMEOUT] /webmessaging/with-ports/017.html (#24486)
    • PASS [expected TIMEOUT] subtest: origin of the script that invoked the method, about:blank
  • OK [expected TIMEOUT] /webmessaging/with-ports/018.html (#24485)
    • PASS [expected TIMEOUT] subtest: origin of the script that invoked the method, javascript:
Stable unexpected results that are known to be intermittent (15)
  • FAIL [expected PASS] /_mozilla/css/dirty_viewport.html (#13731)
  • FAIL [expected PASS] /_mozilla/css/iframe/hide_and_show.html (#15265)
  • FAIL [expected PASS] /_mozilla/mozilla/iframe/resize_after_load.html (#13573)
  • TIMEOUT [expected OK] /_webgl/conformance/glsl/misc/shader-uniform-packing-restrictions.html (#28103)
    • NOTRUN [expected PASS] subtest: Overall test
  • OK /css/css-fonts/variations/at-font-face-font-matching.html (#20684)
    • PASS [expected FAIL] subtest: Matching font-weight: '400' should prefer '450 460' over '500'
    • PASS [expected FAIL] subtest: Matching font-weight: '430' should prefer '450 460' over '500'
    • PASS [expected FAIL] subtest: Matching font-weight: '500' should prefer '450 460' over '400'
    • PASS [expected FAIL] subtest: Matching font-weight: '501' should prefer '501' over '502 510'
    • PASS [expected FAIL] subtest: Matching font-stretch: '100%' should prefer '100%' over '110% 120%'
    • PASS [expected FAIL] subtest: Matching font-stretch: '100%' should prefer '110% 120%' over '115% 116%'
    • PASS [expected FAIL] subtest: Matching font-stretch: '110%' should prefer '100%' over '50% 80%'
    • PASS [expected FAIL] subtest: Matching font-stretch: '90%' should prefer '90% 100%' over '50% 80%'
    • PASS [expected FAIL] subtest: Matching font-stretch: '90%' should prefer '50% 80%' over '60% 70%'
    • PASS [expected FAIL] subtest: Matching font-style: 'normal' should prefer 'oblique 20deg 30deg' over 'oblique -50deg -20deg'
    • And 6 more unexpected results...
  • PASS [expected FAIL] /css/css-text/text-transform/text-transform-full-size-kana-001.html (#21949)
  • PASS [expected FAIL] /css/css-text/text-transform/text-transform-full-size-kana-002.html (#21949)
  • PASS [expected FAIL] /css/css-text/text-transform/text-transform-full-size-kana-003.html (#21949)
  • PASS [expected FAIL] /css/css-text/text-transform/text-transform-full-size-kana-004.html (#21949)
  • OK /html/browsers/browsing-the-web/navigating-across-documents/initial-empty-document/load-pageshow-events-iframe-contentWindow.html (#28681)
    • FAIL [expected PASS] subtest: load & pageshow events do not fire on contentWindow of <iframe> element created with src='' assert_unreached: load should not be fired Reached unreachable code
  • OK /html/browsers/browsing-the-web/navigating-across-documents/initial-empty-document/load-pageshow-events-window-open.html (#28691)
    • FAIL [expected PASS] subtest: load event does not fire on window.open('about:blank') assert_unreached: load should not be fired Reached unreachable code
  • CRASH [expected TIMEOUT] /html/semantics/embedded-content/the-iframe-element/iframe_sandbox_popups_escaping-1.html (#22647)
  • CRASH [expected TIMEOUT] /html/semantics/embedded-content/the-iframe-element/iframe_sandbox_popups_escaping-2.html (#22667)
  • OK /html/semantics/forms/form-submission-0/urlencoded2.window.html (#28687)
    • PASS [expected FAIL] subtest: application/x-www-form-urlencoded: 0x00 in value (normal form)
  • TIMEOUT [expected OK] /webmessaging/without-ports/018.html (#24485)
    • TIMEOUT [expected PASS] subtest: origin of the script that invoked the method, javascript: Test timed out
Stable unexpected results (2)
  • PASS [expected FAIL] /_mozilla/css/servo_center_a.html
  • TIMEOUT [expected PASS] /css/css-position/crashtests/scroll-tree-parent-construction.html

@github-actions GitHub Actions
Copy link

⚠️ Try run (#8025114376) failed.

@Loirooriol Loirooriol added the T-linux-wpt-2020 Do a try run of the WPT label Feb 23, 2024
@github-actions github-actions bot removed the T-linux-wpt-2020 Do a try run of the WPT label Feb 23, 2024
@github-actions GitHub Actions
Copy link

🔨 Triggering try run (#8025724921) for Linux WPT

@github-actions GitHub Actions
Copy link

Test results for linux-wpt-layout-2020 from try job (#8025724921):

Flaky unexpected result (20)
  • CRASH [expected PASS] /_webgl/conformance/glsl/bugs/nested-functions-should-not-crash.html (#30680)
  • TIMEOUT [expected OK] /_webgl/conformance/glsl/misc/shader-with-non-reserved-words.html (#16216)
    • NOTRUN [expected PASS] subtest: Overall test
  • TIMEOUT [expected OK] /_webgl/conformance/uniforms/out-of-bounds-uniform-array-access.html (#26225)
    • NOTRUN [expected PASS] subtest: Overall test
  • TIMEOUT [expected PASS] /css/css-animations/crashtests/add-pseudo-while-animating-001.html
  • TIMEOUT [expected PASS] /css/css-images/cross-fade-legacy-crash.html
  • OK /html/browsers/browsing-the-web/navigating-across-documents/initial-empty-document/load-pageshow-events-iframe-contentWindow.html (#28681)
    • FAIL [expected PASS] subtest: load & pageshow events do not fire on contentWindow of <iframe> element created with src='' assert_unreached: load should not be fired Reached unreachable code
  • OK /html/browsers/browsing-the-web/navigating-across-documents/initial-empty-document/load-pageshow-events-window-open.html (#28691)
    • FAIL [expected PASS] subtest: load event does not fire on window.open('about:blank') assert_unreached: load should not be fired Reached unreachable code
  • TIMEOUT /html/browsers/browsing-the-web/navigating-across-documents/javascript-url-no-beforeunload.window.html (#29055)
    • PASS [expected FAIL] subtest: Navigating an opened window with an iframe via location.href to a javascript: URL must not fire beforeunload on the iframe: undefined completion
  • OK /html/browsers/browsing-the-web/navigating-across-documents/navigation-unload-same-origin-fragment.html (#20768)
    • FAIL [expected PASS] subtest: Tests that a fragment navigation in the unload handler will not block the initial navigation assert_equals: expected "" but got "#fragment"
  • OK /html/browsers/history/the-history-interface/traverse_the_history_2.html (#21383)
    • PASS [expected FAIL] subtest: Multiple history traversals, last would be aborted
  • CRASH [expected OK] /html/semantics/embedded-content/the-iframe-element/iframe_sandbox_popups_escaping-3.html (#24057)
  • TIMEOUT [expected OK] /html/semantics/embedded-content/the-iframe-element/iframe_sandbox_popups_nonescaping-2.html (#22154)
    • NOTRUN [expected FAIL] subtest: Check that popups from a sandboxed iframe do not escape the sandbox
  • FAIL [expected PASS] /html/semantics/embedded-content/the-img-element/image-loading-lazy-slow.html (#30684)
  • OK /html/semantics/forms/form-submission-0/multipart-formdata.window.html (#28725)
    • PASS [expected FAIL] subtest: multipart/form-data: backslash in value (normal form)
  • TIMEOUT [expected PASS] /html/semantics/interactive-elements/the-details-element/auto-expand-ax-slot-recalc-crash.html
  • TIMEOUT /html/webappapis/scripting/events/compile-event-handler-settings-objects.html (#24246)
    • PASS [expected FAIL] subtest: The entry settings object while executing the compiled callback via Web IDL's invoke must be that of the node document
  • TIMEOUT [expected OK] /html/webappapis/scripting/processing-model-2/integration-with-the-javascript-job-queue/promise-job-entry-different-function-realm.html (#25805)
    • TIMEOUT [expected FAIL] subtest: Fulfillment handler on fulfilled promise Test timed out
    • TIMEOUT [expected FAIL] subtest: Rejection handler on rejected promise Test timed out
    • TIMEOUT [expected FAIL] subtest: Thenable resolution Test timed out
  • TIMEOUT /resource-timing/test_resource_timing.https.html (#25216)
    • FAIL [expected PASS] subtest: PerformanceEntry has correct name, initiatorType, startTime, and duration (img) assert_equals: expected 22829568 but got 22829824
  • TIMEOUT [expected OK] /wasm/jsapi/functions/entry.html (#27087)
    • TIMEOUT [expected FAIL] subtest: Start function Test timed out
  • TIMEOUT [expected OK] /webstorage/localstorage-about-blank-3P-iframe-opens-3P-window.partitioned.tentative.html (#29053)
    • TIMEOUT [expected PASS] subtest: StorageKey: test 3P about:blank window opened from a 3P iframe Test timed out
Stable unexpected results that are known to be intermittent (17)
  • FAIL [expected PASS] /_mozilla/css/dirty_viewport.html (#13731)
  • FAIL [expected PASS] /_mozilla/css/iframe/hide_and_show.html (#15265)
  • FAIL [expected PASS] /_mozilla/mozilla/iframe/resize_after_load.html (#13573)
  • CRASH [expected PASS] /_webgl/conformance/glsl/bugs/long-expressions-should-not-crash.html (#19221)
  • TIMEOUT [expected OK] /_webgl/conformance/glsl/misc/shader-uniform-packing-restrictions.html (#28103)
    • NOTRUN [expected PASS] subtest: Overall test
  • OK /css/css-fonts/variations/at-font-face-font-matching.html (#20684)
    • PASS [expected FAIL] subtest: Matching font-weight: '430' should prefer '340 398' over '501 550'
    • PASS [expected FAIL] subtest: Matching font-weight: '501' should prefer '503 520' over '500'
    • PASS [expected FAIL] subtest: Matching font-weight: '501' should prefer '390 410' over '300 350'
    • PASS [expected FAIL] subtest: Matching font-stretch: '100%' should prefer '100%' over '110% 120%'
    • PASS [expected FAIL] subtest: Matching font-stretch: '90%' should prefer '90% 100%' over '50% 80%'
    • PASS [expected FAIL] subtest: Matching font-stretch: '90%' should prefer '60% 70%' over '110% 140%'
    • PASS [expected FAIL] subtest: Matching font-style: 'normal' should prefer 'normal' over 'oblique 0deg'
    • PASS [expected FAIL] subtest: Matching font-style: 'normal' should prefer 'oblique 10deg 40deg' over 'oblique 20deg 30deg'
    • PASS [expected FAIL] subtest: Matching font-style: 'italic' should prefer 'italic' over 'oblique 20deg'
    • PASS [expected FAIL] subtest: Matching font-style: 'italic' should prefer 'oblique 30deg 60deg' over 'oblique 40deg 50deg'
    • And 8 more unexpected results...
  • PASS [expected FAIL] /css/css-text/text-transform/text-transform-full-size-kana-001.html (#21949)
  • PASS [expected FAIL] /css/css-text/text-transform/text-transform-full-size-kana-002.html (#21949)
  • PASS [expected FAIL] /css/css-text/text-transform/text-transform-full-size-kana-003.html (#21949)
  • PASS [expected FAIL] /css/css-text/text-transform/text-transform-full-size-kana-004.html (#21949)
  • TIMEOUT [expected OK] /html/browsers/browsing-the-web/navigating-across-documents/javascript-url-referrer.window.html (#29081)
    • TIMEOUT [expected PASS] subtest: no-referrer referrer policy used to create the starting page Test timed out
  • OK [expected TIMEOUT] /html/interaction/focus/the-autofocus-attribute/supported-elements.html (#24145)
    • FAIL [expected TIMEOUT] subtest: Host element with delegatesFocus including no focusable descendants should be skipped promise_test: Unhandled rejection with value: object "TypeError: host.attachShadow is not a function"
    • FAIL [expected NOTRUN] subtest: Area element should support autofocus promise_test: Unhandled rejection with value: object "TypeError: w.document.querySelector(...) is null"
  • OK [expected TIMEOUT] /html/semantics/embedded-content/the-iframe-element/iframe_sandbox_popups_nonescaping-1.html (#24066)
    • FAIL [expected NOTRUN] subtest: Check that popups from a sandboxed iframe do not escape the sandbox assert_equals: It came from a sandboxed iframe expected "null" but got "http://web-platform.test:8000"
  • OK /html/semantics/forms/historical.html (#28568)
    • FAIL [expected PASS] subtest: <input name=isindex> should not be supported assert_regexp_match: expected object "/?isindex=x$/" but got "about:blank"
  • TIMEOUT /resource-timing/test_resource_timing.html (#25720)
    • PASS [expected FAIL] subtest: PerformanceEntry has correct name, initiatorType, startTime, and duration (img)
  • OK [expected TIMEOUT] /webmessaging/with-ports/017.html (#24486)
    • PASS [expected TIMEOUT] subtest: origin of the script that invoked the method, about:blank
  • TIMEOUT [expected OK] /webmessaging/without-ports/018.html (#24485)
    • TIMEOUT [expected PASS] subtest: origin of the script that invoked the method, javascript: Test timed out

@github-actions GitHub Actions
Copy link

✨ Try run (#8025724921) succeeded.

@Loirooriol Loirooriol marked this pull request as ready for review February 23, 2024 22:58
mrobinson
mrobinson approved these changes Feb 24, 2024
View reviewed changes
Copy link
Member

@mrobinson mrobinson left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice! This is really not a lot of code in the end. I'm a bit surprised that there are only two tests passing with support for <center> added.

components/layout_2020/flow/mod.rs Show resolved Hide resolved
@Loirooriol
Support <div align="..."> and <center> in block layout
c9496b6 
As per HTML [1], <div align="..."> and <center> should align descendants
to the left/center/right. This is similar to having 'auto' margins [2],
but without changing their used values [3].

[1]: https://html.spec.whatwg.org/multipage/rendering.html#flow-content-3
[2]: https://html.spec.whatwg.org/multipage/rendering.html#align-descendants
[3]: whatwg/html#10149
@Loirooriol Loirooriol added this pull request to the merge queue Feb 26, 2024
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Feb 26, 2024
@mrobinson
Copy link
Member

Failure here is #31428.

@mrobinson mrobinson added this pull request to the merge queue Feb 26, 2024
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Feb 26, 2024
@Loirooriol Loirooriol added this pull request to the merge queue Feb 26, 2024
Merged via the queue into servo:main with commit a97a04d Feb 26, 2024
9 checks passed
@Loirooriol Loirooriol deleted the center-and-div-align branch February 26, 2024 19:12
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@mrobinson mrobinson mrobinson approved these changes

Assignees
No one assigned
Labels
A-layout/block A-layout/2020 https://github.com/servo/servo/wiki/Layout-2020
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

None yet
2 participants
@Loirooriol @mrobinson