Add content to appearance:base-select fallback button [chromium/src : main]

0 views
Skip to first unread message

Blink W3C Test Autoroller (Gerrit)

unread,
Apr 17, 2024, 8:58:52 PMApr 17
to Alexis Menard, AyeAye, Chromium LUCI CQ, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org

Message from Blink W3C Test Autoroller

Exportable changes to web-platform-tests were detected in this CL and a pull request in the upstream repo has been made: https://github.com/web-platform-tests/wpt/pull/45774.

When this CL lands, the bot will automatically merge the PR on GitHub if the required GitHub checks pass; otherwise, ecosystem-infra@ team will triage the failures and may contact you.

WPT Export docs:
https://chromium.googlesource.com/chromium/src/+/main/docs/testing/web_platform_tests.md#Automatic-export-process

Open in Gerrit

Related details

Attention set is empty
Submit Requirements:
  • requirement satisfiedCode-Coverage
  • requirement is not satisfiedCode-Review
Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
Gerrit-MessageType: comment
Gerrit-Project: chromium/src
Gerrit-Branch: main
Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
Gerrit-Change-Number: 5464171
Gerrit-PatchSet: 1
Gerrit-Owner: Joey Arhar <jar...@chromium.org>
Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
Gerrit-CC: Alexis Menard <alexis...@intel.com>
Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
Gerrit-Comment-Date: Thu, 18 Apr 2024 00:58:42 +0000
Gerrit-HasComments: No
Gerrit-Has-Labels: No
satisfied_requirement
unsatisfied_requirement
open
diffy

Joey Arhar (Gerrit)

unread,
Apr 24, 2024, 6:13:12 PMApr 24
to Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org

Joey Arhar voted Commit-Queue+1

Commit-Queue+1
Open in Gerrit

Related details

Attention set is empty
Submit Requirements:
  • requirement satisfiedCode-Coverage
  • requirement is not satisfiedCode-Review
Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
Gerrit-MessageType: comment
Gerrit-Project: chromium/src
Gerrit-Branch: main
Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
Gerrit-Change-Number: 5464171
Gerrit-PatchSet: 4
Gerrit-Owner: Joey Arhar <jar...@chromium.org>
Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
Gerrit-CC: Alexis Menard <alexis...@intel.com>
Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
Gerrit-CC: Daniel Cheng <dch...@chromium.org>
Gerrit-Comment-Date: Wed, 24 Apr 2024 22:13:03 +0000
Gerrit-HasComments: No
Gerrit-Has-Labels: Yes
satisfied_requirement
unsatisfied_requirement
open
diffy

Joey Arhar (Gerrit)

unread,
Apr 24, 2024, 8:24:29 PMApr 24
to David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
Attention needed from David Baron

Joey Arhar added 1 comment

File third_party/blink/renderer/core/html/resources/stylable_select.css
Line 154, Patchset 4 (Latest): background-image: light-dark(
Joey Arhar . unresolved

This background-image property is the cause of a test failure which I don't fully understand: https://chromium-layout-test-archives.storage.googleapis.com/results.html?json=chromium/try/linux-rel/1790580/high_dpi_blink_wpt_tests%20%28with%20patch%29/full_results_jsonp.js

I'm inclined to wrap the whole value in an -internal-appearance-auto-base-select() to just make it not apply when not in appearance:base-select in order to make the test pass, but it will be a bunch of extra and kinda hacky code to try resolving the function on a pseudo element. Not even sure it would work since I would have to find the computed style of the appearance property of the pseudo element's parent select - but in this case the "pseudo element" resolves to a real element, so I don't even know what the state would look like StyleCascade::Resolve.

Anyway, I couldn't repro this tiny difference on my mac. Do you have any ideas what is causing this?

Open in Gerrit

Related details

Attention is currently required from:
  • David Baron
Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement is not satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 4
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: David Baron <dba...@chromium.org>
    Gerrit-Comment-Date: Thu, 25 Apr 2024 00:24:19 +0000
    Gerrit-HasComments: Yes
    Gerrit-Has-Labels: No
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    David Baron (Gerrit)

    unread,
    Apr 25, 2024, 3:12:53 PMApr 25
    to Joey Arhar, David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from Joey Arhar

    David Baron added 11 comments

    Commit Message
    Line 19, Patchset 4 (Latest):- ::select-fallback-selectedoption which targets the <span> inside the
    David Baron . unresolved

    I'm a little concerned about the name for this one, since "selectedoption" makes it sound like it's an `<option>`, which it isn't. This could be `::select-fallback-button-text` which maybe says a little more about how it fits structurally rather than where the text comes from. Or it could be something else...

    Line 26, Patchset 4 (Latest):This patch also changes some tests to inerhit from PageTestBase. Adding
    David Baron . unresolved

    inherit

    File third_party/blink/renderer/core/css/css_selector.h
    Line 294, Patchset 4 (Latest): kPseudoSelectButton,
    David Baron . unresolved

    I wonder if these should also have the word `Fallback` in the names.

    File third_party/blink/renderer/core/css/parser/css_selector_parser.cc
    Line 1096, Patchset 4 (Latest): case CSSSelector::kPseudoSelectDatalist:
    David Baron . unresolved

    add to this switch as well?

    File third_party/blink/renderer/core/html/resources/stylable_select.css
    Line 154, Patchset 4 (Latest): background-image: light-dark(
    Joey Arhar . unresolved

    This background-image property is the cause of a test failure which I don't fully understand: https://chromium-layout-test-archives.storage.googleapis.com/results.html?json=chromium/try/linux-rel/1790580/high_dpi_blink_wpt_tests%20%28with%20patch%29/full_results_jsonp.js

    I'm inclined to wrap the whole value in an -internal-appearance-auto-base-select() to just make it not apply when not in appearance:base-select in order to make the test pass, but it will be a bunch of extra and kinda hacky code to try resolving the function on a pseudo element. Not even sure it would work since I would have to find the computed style of the appearance property of the pseudo element's parent select - but in this case the "pseudo element" resolves to a real element, so I don't even know what the state would look like StyleCascade::Resolve.

    Anyway, I couldn't repro this tiny difference on my mac. Do you have any ideas what is causing this?

    David Baron

    Is it really specifically *this* declaration? That seems really weird. It seems like a layout issue, and one that I think would be much more likely if it were the presence or layout styles of the pseudo-element and not the background.

    (It also seems possible that there's something that subtly broke interoperable behavior of the `select` element here, particularly if it's not really the background.)

    Line 159, Patchset 4 (Latest): background-size: contain;
    David Baron . unresolved

    Given that one of these is a div and the other is a span, maybe it would be helpful to put `display` values in for both of these to make it clearer what's going on?

    Line 163, Patchset 4 (Latest): outline: none;
    padding-bottom: 2px;
    padding-inline-start: 3px;
    padding-inline-end: 3px;
    padding-top: 2px;
    width: 1.2em;
    min-width: 1.2em;
    max-width: 1.2em;
    David Baron . unresolved

    The mix of physical and logical (particularly for padding) seems like it's going to go badly in vertical writing mode.

    Maybe try writing it all logical, and add a testcase for vertical-writing-mode selects?

    Line 174, Patchset 4 (Latest): color: inherit;
    min-width: 0px;
    max-height: 100%;
    David Baron . unresolved

    `min-inline-size` and `max-block-size`

    Line 178, Patchset 4 (Latest): flex-shrink: 1;
    overflow-x: hidden;
    overflow-y: hidden;
    David Baron . unresolved

    `overflow-block` and `overflow-inline`

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/resources/stylable-select-styles.css
    File-level comment, Patchset 4 (Latest):
    David Baron . unresolved

    same comments on the real style sheet also apply here

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-custom-button-no-datalist.tentative.html
    Line 6, Patchset 4 (Latest):<link rel=stylesheet href="resources/select-reset-non-interoperable-styles.css">
    David Baron . unresolved

    Is there a reason that only this test and not the other two still needs this style sheet?

    Open in Gerrit

    Related details

    Attention is currently required from:
    • Joey Arhar
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement is not satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 4
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: Joey Arhar <jar...@chromium.org>
    Gerrit-Comment-Date: Thu, 25 Apr 2024 19:12:40 +0000
    Gerrit-HasComments: Yes
    Gerrit-Has-Labels: No
    Comment-In-Reply-To: Joey Arhar <jar...@chromium.org>
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    Joey Arhar (Gerrit)

    unread,
    Apr 29, 2024, 4:40:23 PMApr 29
    to David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from David Baron

    Joey Arhar added 9 comments

    Commit Message
    Line 19, Patchset 4:- ::select-fallback-selectedoption which targets the <span> inside the
    David Baron . resolved

    I'm a little concerned about the name for this one, since "selectedoption" makes it sound like it's an `<option>`, which it isn't. This could be `::select-fallback-button-text` which maybe says a little more about how it fits structurally rather than where the text comes from. Or it could be something else...

    Joey Arhar

    Yeah I think that the entire `<selectedoption>` name is not great because you can't verbally say it without conflating "selected `<option>`" and `<selectedoption>`, but it will certainly get bikeshedded more at some point.

    I'll change this pseudo to ::select-fallback-button-text and put a comment on it saying that we should update it if the `<selectedoption>` element name changes.

    Line 26, Patchset 4:This patch also changes some tests to inerhit from PageTestBase. Adding
    David Baron . resolved

    inherit

    Joey Arhar

    Done

    File third_party/blink/renderer/core/css/css_selector.h
    Line 294, Patchset 4: kPseudoSelectButton,
    David Baron . resolved

    I wonder if these should also have the word `Fallback` in the names.

    Joey Arhar

    Done

    File third_party/blink/renderer/core/css/parser/css_selector_parser.cc
    Line 1096, Patchset 4: case CSSSelector::kPseudoSelectDatalist:
    David Baron . resolved

    add to this switch as well?

    Joey Arhar

    Done

    File third_party/blink/renderer/core/html/resources/stylable_select.css
    Line 154, Patchset 4: background-image: light-dark(
    Joey Arhar . unresolved

    This background-image property is the cause of a test failure which I don't fully understand: https://chromium-layout-test-archives.storage.googleapis.com/results.html?json=chromium/try/linux-rel/1790580/high_dpi_blink_wpt_tests%20%28with%20patch%29/full_results_jsonp.js

    I'm inclined to wrap the whole value in an -internal-appearance-auto-base-select() to just make it not apply when not in appearance:base-select in order to make the test pass, but it will be a bunch of extra and kinda hacky code to try resolving the function on a pseudo element. Not even sure it would work since I would have to find the computed style of the appearance property of the pseudo element's parent select - but in this case the "pseudo element" resolves to a real element, so I don't even know what the state would look like StyleCascade::Resolve.

    Anyway, I couldn't repro this tiny difference on my mac. Do you have any ideas what is causing this?

    David Baron

    Is it really specifically *this* declaration? That seems really weird. It seems like a layout issue, and one that I think would be much more likely if it were the presence or layout styles of the pseudo-element and not the background.

    (It also seems possible that there's something that subtly broke interoperable behavior of the `select` element here, particularly if it's not really the background.)

    Joey Arhar

    Ok, I'm going to mark the test as failing and file a bug: https://issues.chromium.org/issues/337904202
    Sound good?

    Line 159, Patchset 4: background-size: contain;
    David Baron . unresolved

    Given that one of these is a div and the other is a span, maybe it would be helpful to put `display` values in for both of these to make it clearer what's going on?

    Joey Arhar

    You mean put display:block on ::select-fallback-button-icon and display:inline on ::select-fallback-button-text?

    Line 174, Patchset 4: color: inherit;
    min-width: 0px;
    max-height: 100%;
    David Baron . resolved

    `min-inline-size` and `max-block-size`

    Joey Arhar

    Done

    Line 178, Patchset 4: flex-shrink: 1;
    overflow-x: hidden;
    overflow-y: hidden;
    David Baron . resolved

    `overflow-block` and `overflow-inline`

    Joey Arhar

    Done

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-custom-button-no-datalist.tentative.html
    Line 6, Patchset 4:<link rel=stylesheet href="resources/select-reset-non-interoperable-styles.css">
    David Baron . resolved

    Is there a reason that only this test and not the other two still needs this style sheet?

    Joey Arhar

    I already deleted this CSS file, I must have forgotten to remove this reference to it. I have deleted this line.

    Open in Gerrit

    Related details

    Attention is currently required from:
    • David Baron
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement is not satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 5
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: David Baron <dba...@chromium.org>
    Gerrit-Comment-Date: Mon, 29 Apr 2024 20:40:13 +0000
    Gerrit-HasComments: Yes
    Gerrit-Has-Labels: No
    Comment-In-Reply-To: David Baron <dba...@chromium.org>
    Comment-In-Reply-To: Joey Arhar <jar...@chromium.org>
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    David Baron (Gerrit)

    unread,
    Apr 29, 2024, 5:04:26 PMApr 29
    to Joey Arhar, David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from Joey Arhar

    David Baron added 3 comments

    Patchset-level comments
    File-level comment, Patchset 6 (Latest):
    David Baron . resolved

    Since there are still some unaddressed comments from the previous review, I'm just going to answer the questions you asked (I hope I didn't miss any) but not re-review the whole CL right now. (Let me know if there was something you wanted me to re-review now.)

    File third_party/blink/renderer/core/html/resources/stylable_select.css
    Line 154, Patchset 4: background-image: light-dark(
    Joey Arhar . unresolved

    This background-image property is the cause of a test failure which I don't fully understand: https://chromium-layout-test-archives.storage.googleapis.com/results.html?json=chromium/try/linux-rel/1790580/high_dpi_blink_wpt_tests%20%28with%20patch%29/full_results_jsonp.js

    I'm inclined to wrap the whole value in an -internal-appearance-auto-base-select() to just make it not apply when not in appearance:base-select in order to make the test pass, but it will be a bunch of extra and kinda hacky code to try resolving the function on a pseudo element. Not even sure it would work since I would have to find the computed style of the appearance property of the pseudo element's parent select - but in this case the "pseudo element" resolves to a real element, so I don't even know what the state would look like StyleCascade::Resolve.

    Anyway, I couldn't repro this tiny difference on my mac. Do you have any ideas what is causing this?

    David Baron

    Is it really specifically *this* declaration? That seems really weird. It seems like a layout issue, and one that I think would be much more likely if it were the presence or layout styles of the pseudo-element and not the background.

    (It also seems possible that there's something that subtly broke interoperable behavior of the `select` element here, particularly if it's not really the background.)

    Joey Arhar

    Ok, I'm going to mark the test as failing and file a bug: https://issues.chromium.org/issues/337904202
    Sound good?

    David Baron

    Hmmm. I'm a little concerned about something actually being broken here.

    Also... do you know if the test is only failing when the feature is enabled, or if it's failing even if the feature isn't enabled? (The latter is more concerning, the former might suggest it's ok to punt on this for now and make the bug you filed block the main bug... but also to add the failing test to a virtual test suite so we test it in the passing configuration too?)

    Line 159, Patchset 4: background-size: contain;
    David Baron . unresolved

    Given that one of these is a div and the other is a span, maybe it would be helpful to put `display` values in for both of these to make it clearer what's going on?

    Joey Arhar

    You mean put display:block on ::select-fallback-button-icon and display:inline on ::select-fallback-button-text?

    David Baron

    yes

    Open in Gerrit

    Related details

    Attention is currently required from:
    • Joey Arhar
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement is not satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 6
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: Joey Arhar <jar...@chromium.org>
    Gerrit-Comment-Date: Mon, 29 Apr 2024 21:04:15 +0000
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    Joey Arhar (Gerrit)

    unread,
    Apr 29, 2024, 8:42:18 PMApr 29
    to David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from David Baron

    Joey Arhar added 4 comments

    File third_party/blink/renderer/core/html/resources/stylable_select.css
    Line 154, Patchset 4: background-image: light-dark(
    Joey Arhar . unresolved

    This background-image property is the cause of a test failure which I don't fully understand: https://chromium-layout-test-archives.storage.googleapis.com/results.html?json=chromium/try/linux-rel/1790580/high_dpi_blink_wpt_tests%20%28with%20patch%29/full_results_jsonp.js

    I'm inclined to wrap the whole value in an -internal-appearance-auto-base-select() to just make it not apply when not in appearance:base-select in order to make the test pass, but it will be a bunch of extra and kinda hacky code to try resolving the function on a pseudo element. Not even sure it would work since I would have to find the computed style of the appearance property of the pseudo element's parent select - but in this case the "pseudo element" resolves to a real element, so I don't even know what the state would look like StyleCascade::Resolve.

    Anyway, I couldn't repro this tiny difference on my mac. Do you have any ideas what is causing this?

    David Baron

    Is it really specifically *this* declaration? That seems really weird. It seems like a layout issue, and one that I think would be much more likely if it were the presence or layout styles of the pseudo-element and not the background.

    (It also seems possible that there's something that subtly broke interoperable behavior of the `select` element here, particularly if it's not really the background.)

    Joey Arhar

    Ok, I'm going to mark the test as failing and file a bug: https://issues.chromium.org/issues/337904202
    Sound good?

    David Baron

    Hmmm. I'm a little concerned about something actually being broken here.

    Also... do you know if the test is only failing when the feature is enabled, or if it's failing even if the feature isn't enabled? (The latter is more concerning, the former might suggest it's ok to punt on this for now and make the bug you filed block the main bug... but also to add the failing test to a virtual test suite so we test it in the passing configuration too?)

    Joey Arhar

    The test only fails when the feature is enabled because when the feature is disabled this stylesheet is not applied and the extra DOM contents are not added to the UA shadowroot. I manually verified that the test passes when disabling the StylableSelect flag.

    Line 159, Patchset 4: background-size: contain;
    David Baron . resolved

    Given that one of these is a div and the other is a span, maybe it would be helpful to put `display` values in for both of these to make it clearer what's going on?

    Joey Arhar

    You mean put display:block on ::select-fallback-button-icon and display:inline on ::select-fallback-button-text?

    David Baron

    yes

    Joey Arhar

    Done

    Line 163, Patchset 4: outline: none;

    padding-bottom: 2px;
    padding-inline-start: 3px;
    padding-inline-end: 3px;
    padding-top: 2px;
    width: 1.2em;
    min-width: 1.2em;
    max-width: 1.2em;
    David Baron . unresolved

    The mix of physical and logical (particularly for padding) seems like it's going to go badly in vertical writing mode.

    Maybe try writing it all logical, and add a testcase for vertical-writing-mode selects?

    Joey Arhar

    I changed the px values in this rule to em values, and i added reftests for vertical-rl and vertical-lr. They seem fine to me, but I suppose that in order to be on par with appearance:auto select then maybe we should rotate the icon or move it around.

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/resources/stylable-select-styles.css
    File-level comment, Patchset 4:
    David Baron . resolved

    same comments on the real style sheet also apply here

    Joey Arhar

    Done

    Open in Gerrit

    Related details

    Attention is currently required from:
    • David Baron
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement is not satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 6
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: David Baron <dba...@chromium.org>
    Gerrit-Comment-Date: Tue, 30 Apr 2024 00:42:09 +0000
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    David Baron (Gerrit)

    unread,
    Apr 29, 2024, 8:45:11 PMApr 29
    to Joey Arhar, David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from Joey Arhar

    David Baron added 2 comments

    Patchset-level comments
    File-level comment, Patchset 7 (Latest):
    David Baron . resolved

    again just a comment reply and not a re-review:

    File third_party/blink/renderer/core/html/resources/stylable_select.css
    Line 163, Patchset 4: outline: none;
    padding-bottom: 2px;
    padding-inline-start: 3px;
    padding-inline-end: 3px;
    padding-top: 2px;
    width: 1.2em;
    min-width: 1.2em;
    max-width: 1.2em;
    David Baron . unresolved

    The mix of physical and logical (particularly for padding) seems like it's going to go badly in vertical writing mode.

    Maybe try writing it all logical, and add a testcase for vertical-writing-mode selects?

    Joey Arhar

    I changed the px values in this rule to em values, and i added reftests for vertical-rl and vertical-lr. They seem fine to me, but I suppose that in order to be on par with appearance:auto select then maybe we should rotate the icon or move it around.

    David Baron

    Sorry, by physical I meant `padding-bottom` and `padding-top` and `width` and `*-width`, whereas logical is `padding-inline-start` and `padding-inline-end`. I think the `padding-bottom` should be `padding-block-end`, the `padding-top` should be `padding-block-start`, and all the `*width` should be `*inline-size`.

    Open in Gerrit

    Related details

    Attention is currently required from:
    • Joey Arhar
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement is not satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 7
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: Joey Arhar <jar...@chromium.org>
    Gerrit-Comment-Date: Tue, 30 Apr 2024 00:45:01 +0000
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    Joey Arhar (Gerrit)

    unread,
    Apr 30, 2024, 2:15:01 PMApr 30
    to David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from David Baron

    Joey Arhar added 1 comment

    File third_party/blink/renderer/core/html/resources/stylable_select.css
    Line 163, Patchset 4: outline: none;
    padding-bottom: 2px;
    padding-inline-start: 3px;
    padding-inline-end: 3px;
    padding-top: 2px;
    width: 1.2em;
    min-width: 1.2em;
    max-width: 1.2em;
    David Baron . unresolved

    The mix of physical and logical (particularly for padding) seems like it's going to go badly in vertical writing mode.

    Maybe try writing it all logical, and add a testcase for vertical-writing-mode selects?

    Joey Arhar

    I changed the px values in this rule to em values, and i added reftests for vertical-rl and vertical-lr. They seem fine to me, but I suppose that in order to be on par with appearance:auto select then maybe we should rotate the icon or move it around.

    David Baron

    Sorry, by physical I meant `padding-bottom` and `padding-top` and `width` and `*-width`, whereas logical is `padding-inline-start` and `padding-inline-end`. I think the `padding-bottom` should be `padding-block-end`, the `padding-top` should be `padding-block-start`, and all the `*width` should be `*inline-size`.

    Joey Arhar

    Thank! I gave it a shot, how does it look?

    Open in Gerrit

    Related details

    Attention is currently required from:
    • David Baron
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement is not satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 9
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: David Baron <dba...@chromium.org>
    Gerrit-Comment-Date: Tue, 30 Apr 2024 18:14:52 +0000
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    David Baron (Gerrit)

    unread,
    May 1, 2024, 9:34:26 AMMay 1
    to Joey Arhar, David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from Joey Arhar

    David Baron added 22 comments

    Patchset-level comments
    File-level comment, Patchset 9 (Latest):
    David Baron . resolved

    New round of comments, mostly nits, but a bunch of real bugs in the style sheet.

    File third_party/blink/renderer/core/css/css_selector.h
    Line 297, Patchset 9 (Latest): kPseudoSelectFallbackButtonText,
    David Baron . unresolved

    resort

    File third_party/blink/renderer/core/css/css_selector.cc
    Line 414, Patchset 9 (Latest): case kPseudoSelectFallbackButtonText:
    David Baron . unresolved

    resort

    Line 785, Patchset 9 (Latest): case kPseudoSelectFallbackButtonText:
    David Baron . unresolved

    resort

    Line 1476, Patchset 9 (Latest): case kPseudoSelectFallbackDatalist:
    David Baron . unresolved

    sort alphabetically like the rest

    File third_party/blink/renderer/core/css/parser/css_selector_parser.cc
    Line 79, Patchset 9 (Latest): case CSSSelector::PseudoType::kPseudoSelectFallbackButtonText:
    David Baron . unresolved

    resort yours, even though the rest aren't fully sorted

    File third_party/blink/renderer/core/css/rule_feature_set.cc
    Line 185, Patchset 9 (Latest): case CSSSelector::kPseudoSelectFallbackButtonText:
    David Baron . unresolved

    resort

    File third_party/blink/renderer/core/css/rule_set.cc
    Line 293, Patchset 9 (Latest): case CSSSelector::kPseudoSelectFallbackButtonText:
    David Baron . unresolved

    resort

    Line 528, Patchset 9 (Latest): case CSSSelector::kPseudoSelectFallbackButtonText:
    David Baron . unresolved

    resort

    Line 551, Patchset 9 (Latest): case CSSSelector::kPseudoSelectFallbackButtonText:
    David Baron . unresolved

    resort

    File third_party/blink/renderer/core/css/selector_checker.cc
    Line 2142, Patchset 9 (Latest): case CSSSelector::kPseudoSelectFallbackButtonText:
    David Baron . unresolved

    resort

    File third_party/blink/renderer/core/dom/element.cc
    Line 7269, Patchset 9 (Latest): type == CSSSelector::kPseudoSelectFallbackDatalist ||
    type == CSSSelector::kPseudoSelectFallbackButtonIcon ||
    type == CSSSelector::kPseudoSelectFallbackButton ||
    David Baron . unresolved

    maybe sort in one of the two other normal ways these are sorted?

    File third_party/blink/renderer/core/html/resources/stylable_select.css
    Line 154, Patchset 4: background-image: light-dark(
    Joey Arhar . unresolved

    This background-image property is the cause of a test failure which I don't fully understand: https://chromium-layout-test-archives.storage.googleapis.com/results.html?json=chromium/try/linux-rel/1790580/high_dpi_blink_wpt_tests%20%28with%20patch%29/full_results_jsonp.js

    I'm inclined to wrap the whole value in an -internal-appearance-auto-base-select() to just make it not apply when not in appearance:base-select in order to make the test pass, but it will be a bunch of extra and kinda hacky code to try resolving the function on a pseudo element. Not even sure it would work since I would have to find the computed style of the appearance property of the pseudo element's parent select - but in this case the "pseudo element" resolves to a real element, so I don't even know what the state would look like StyleCascade::Resolve.

    Anyway, I couldn't repro this tiny difference on my mac. Do you have any ideas what is causing this?

    David Baron

    Is it really specifically *this* declaration? That seems really weird. It seems like a layout issue, and one that I think would be much more likely if it were the presence or layout styles of the pseudo-element and not the background.

    (It also seems possible that there's something that subtly broke interoperable behavior of the `select` element here, particularly if it's not really the background.)

    Joey Arhar

    Ok, I'm going to mark the test as failing and file a bug: https://issues.chromium.org/issues/337904202
    Sound good?

    David Baron

    Hmmm. I'm a little concerned about something actually being broken here.

    Also... do you know if the test is only failing when the feature is enabled, or if it's failing even if the feature isn't enabled? (The latter is more concerning, the former might suggest it's ok to punt on this for now and make the bug you filed block the main bug... but also to add the failing test to a virtual test suite so we test it in the passing configuration too?)

    Joey Arhar

    The test only fails when the feature is enabled because when the feature is disabled this stylesheet is not applied and the extra DOM contents are not added to the UA shadowroot. I manually verified that the test passes when disabling the StylableSelect flag.

    David Baron

    ok, seems like this needs at least a `TODO(crbug.com/NUM)` comment somewhere, since it still seems like there's *something* broken that could be an issue

    Line 161, Patchset 9 (Latest): margin-inline-start: 0.3em;
    David Baron . unresolved

    I might prefer `0.25em` rather than `0.3em`, since it's an integer number of pixels (and what you had before) at the default font size.

    Line 163, Patchset 9 (Latest): outline: none;
    padding-top: padding-block-start;
    padding-bottom: padding-block-end;
    David Baron . unresolved

    This should say:

    ```
    padding-block-start: 2px;
    padding-block-end: 2px;
    ```

    (Do these styles... do something?)

    Line 176, Patchset 9 (Latest): min-inline-width: 0px;
    David Baron . unresolved

    `min-inline-size`

    Line 180, Patchset 9 (Latest): overflow-block: hidden;
    overflow-inline: hidden;
    David Baron . unresolved

    now that I think about it this should just be `overflow: hidden`, no need for per-axis values

    File third_party/blink/renderer/core/html/shadow/shadow_element_names.json5
    Line 109, Patchset 9 (Latest): name: "select-fallback-button-text",
    David Baron . unresolved

    resort

    File third_party/blink/renderer/core/inspector/inspector_trace_events.cc
    Line 410, Patchset 9 (Latest): DEFINE_STRING_MAPPING(PseudoSelectFallbackButtonText)
    David Baron . unresolved

    resort

    File third_party/blink/web_tests/TestExpectations
    Line 5308, Patchset 9 (Latest):crbug.com/1511354 [ Linux ] virtual/stylable-select-disabled/external/wpt/html/semantics/forms/the-select-element/stylable-select/native-popup-with-datalist.tentative.html [ Failure ]
    David Baron . unresolved

    why Linux-only?

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/resources/stylable-select-styles.css
    File-level comment, Patchset 4:
    David Baron . unresolved

    same comments on the real style sheet also apply here

    Joey Arhar

    Done

    David Baron

    reopening for more open comments on the real style sheet

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-lr-ref.html
    File-level comment, Patchset 9 (Latest):
    David Baron . unresolved

    Please also look at these and make sure they're sensible visually. (Given my comments on the style sheet, I'm not so sure that's the case right now.)

    Open in Gerrit

    Related details

    Attention is currently required from:
    • Joey Arhar
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement is not satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 9
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: Joey Arhar <jar...@chromium.org>
    Gerrit-Comment-Date: Wed, 01 May 2024 13:34:08 +0000
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    Joey Arhar (Gerrit)

    unread,
    May 1, 2024, 4:29:22 PMMay 1
    to David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from David Baron

    Joey Arhar added 23 comments

    File third_party/blink/renderer/core/css/css_selector.h
    Line 297, Patchset 9 (Latest): kPseudoSelectFallbackButtonText,
    David Baron . resolved

    resort

    Joey Arhar

    Done

    File third_party/blink/renderer/core/css/css_selector.cc
    Line 414, Patchset 9 (Latest): case kPseudoSelectFallbackButtonText:
    David Baron . resolved

    resort

    Joey Arhar

    Done

    Line 785, Patchset 9 (Latest): case kPseudoSelectFallbackButtonText:
    David Baron . resolved

    resort

    Joey Arhar

    Done

    Line 1476, Patchset 9 (Latest): case kPseudoSelectFallbackDatalist:
    David Baron . resolved

    sort alphabetically like the rest

    Joey Arhar

    Done

    File third_party/blink/renderer/core/css/parser/css_selector_parser.cc
    Line 79, Patchset 9 (Latest): case CSSSelector::PseudoType::kPseudoSelectFallbackButtonText:
    David Baron . resolved

    resort yours, even though the rest aren't fully sorted

    Joey Arhar

    Done

    File third_party/blink/renderer/core/css/rule_feature_set.cc
    Line 185, Patchset 9 (Latest): case CSSSelector::kPseudoSelectFallbackButtonText:
    David Baron . resolved

    resort

    Joey Arhar

    Done

    File third_party/blink/renderer/core/css/rule_set.cc
    Line 293, Patchset 9 (Latest): case CSSSelector::kPseudoSelectFallbackButtonText:
    David Baron . resolved

    resort

    Joey Arhar

    Done

    Line 528, Patchset 9 (Latest): case CSSSelector::kPseudoSelectFallbackButtonText:
    David Baron . resolved

    resort

    Joey Arhar

    Done

    Line 551, Patchset 9 (Latest): case CSSSelector::kPseudoSelectFallbackButtonText:
    David Baron . resolved

    resort

    Joey Arhar

    Done

    File third_party/blink/renderer/core/css/selector_checker.cc
    Line 2142, Patchset 9 (Latest): case CSSSelector::kPseudoSelectFallbackButtonText:
    David Baron . resolved

    resort

    Joey Arhar

    Done

    File third_party/blink/renderer/core/dom/element.cc
    Line 7269, Patchset 9 (Latest): type == CSSSelector::kPseudoSelectFallbackDatalist ||
    type == CSSSelector::kPseudoSelectFallbackButtonIcon ||
    type == CSSSelector::kPseudoSelectFallbackButton ||
    David Baron . resolved

    maybe sort in one of the two other normal ways these are sorted?

    Joey Arhar

    Done

    File third_party/blink/renderer/core/html/resources/stylable_select.css
    Line 154, Patchset 4: background-image: light-dark(
    Joey Arhar . resolved

    This background-image property is the cause of a test failure which I don't fully understand: https://chromium-layout-test-archives.storage.googleapis.com/results.html?json=chromium/try/linux-rel/1790580/high_dpi_blink_wpt_tests%20%28with%20patch%29/full_results_jsonp.js

    I'm inclined to wrap the whole value in an -internal-appearance-auto-base-select() to just make it not apply when not in appearance:base-select in order to make the test pass, but it will be a bunch of extra and kinda hacky code to try resolving the function on a pseudo element. Not even sure it would work since I would have to find the computed style of the appearance property of the pseudo element's parent select - but in this case the "pseudo element" resolves to a real element, so I don't even know what the state would look like StyleCascade::Resolve.

    Anyway, I couldn't repro this tiny difference on my mac. Do you have any ideas what is causing this?

    David Baron

    Is it really specifically *this* declaration? That seems really weird. It seems like a layout issue, and one that I think would be much more likely if it were the presence or layout styles of the pseudo-element and not the background.

    (It also seems possible that there's something that subtly broke interoperable behavior of the `select` element here, particularly if it's not really the background.)

    Joey Arhar

    Ok, I'm going to mark the test as failing and file a bug: https://issues.chromium.org/issues/337904202
    Sound good?

    David Baron

    Hmmm. I'm a little concerned about something actually being broken here.

    Also... do you know if the test is only failing when the feature is enabled, or if it's failing even if the feature isn't enabled? (The latter is more concerning, the former might suggest it's ok to punt on this for now and make the bug you filed block the main bug... but also to add the failing test to a virtual test suite so we test it in the passing configuration too?)

    Joey Arhar

    The test only fails when the feature is enabled because when the feature is disabled this stylesheet is not applied and the extra DOM contents are not added to the UA shadowroot. I manually verified that the test passes when disabling the StylableSelect flag.

    David Baron

    ok, seems like this needs at least a `TODO(crbug.com/NUM)` comment somewhere, since it still seems like there's *something* broken that could be an issue

    Joey Arhar

    Done

    Line 161, Patchset 9 (Latest): margin-inline-start: 0.3em;
    David Baron . resolved

    I might prefer `0.25em` rather than `0.3em`, since it's an integer number of pixels (and what you had before) at the default font size.

    Joey Arhar

    Done

    Line 161, Patchset 9 (Latest): margin-inline-start: 0.3em;
    David Baron . resolved

    I might prefer `0.25em` rather than `0.3em`, since it's an integer number of pixels (and what you had before) at the default font size.

    Joey Arhar

    Done

    Line 163, Patchset 9 (Latest): outline: none;
    padding-top: padding-block-start;
    padding-bottom: padding-block-end;
    David Baron . resolved

    This should say:

    ```
    padding-block-start: 2px;
    padding-block-end: 2px;
    ```

    (Do these styles... do something?)

    Joey Arhar

    Ah that makes a lot more sense, sorry I misunderstood 😅
    I'm getting the hang of this now, so I also fixed the height property in this rule and the padding setting in the datalist rule.

    Line 176, Patchset 9 (Latest): min-inline-width: 0px;
    David Baron . resolved

    `min-inline-size`

    Joey Arhar

    Done

    Line 180, Patchset 9 (Latest): overflow-block: hidden;
    overflow-inline: hidden;
    David Baron . resolved

    now that I think about it this should just be `overflow: hidden`, no need for per-axis values

    Joey Arhar

    Done

    Line 180, Patchset 9 (Latest): overflow-block: hidden;
    overflow-inline: hidden;
    David Baron . resolved

    now that I think about it this should just be `overflow: hidden`, no need for per-axis values

    Joey Arhar

    Done

    File third_party/blink/renderer/core/html/shadow/shadow_element_names.json5
    Line 109, Patchset 9 (Latest): name: "select-fallback-button-text",
    David Baron . resolved

    resort

    Joey Arhar

    Done

    File third_party/blink/renderer/core/inspector/inspector_trace_events.cc
    Line 410, Patchset 9 (Latest): DEFINE_STRING_MAPPING(PseudoSelectFallbackButtonText)
    David Baron . resolved

    resort

    Joey Arhar

    Done

    File third_party/blink/web_tests/TestExpectations
    Line 5308, Patchset 9 (Latest):crbug.com/1511354 [ Linux ] virtual/stylable-select-disabled/external/wpt/html/semantics/forms/the-select-element/stylable-select/native-popup-with-datalist.tentative.html [ Failure ]
    David Baron . unresolved

    why Linux-only?

    Joey Arhar

    Only linux-rel failed. Maybe that's because highdpi tests are only run on linux, but I just ran it on my mac and it passed, so I guess it really is a linux-only issue. Or maybe the testing flag doesn't work on macos even though it seems to be running it properly.

    I mentioned in the layout bug that this only is happening on linux.

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/resources/stylable-select-styles.css
    File-level comment, Patchset 4:
    David Baron . resolved

    same comments on the real style sheet also apply here

    Joey Arhar

    Done

    David Baron

    reopening for more open comments on the real style sheet

    Joey Arhar

    Done

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-lr-ref.html
    David Baron . unresolved

    Please also look at these and make sure they're sensible visually. (Given my comments on the style sheet, I'm not so sure that's the case right now.)

    Joey Arhar
    Here is what vertical-rl looks like. The arrow still needs to be rotated and the option elements have non-vertical-writing-mode-friendly rules from the old UA sheet that I will fix in a subsequent patch. Do you have any recommendation for rotating that SVG?
    data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAJYCAIAAAAVFBUnAAAAKXRFWHRjaGVja3N1bQBiMTNjYmEzNTUwNWI0NGRjNjM5ODczNTM4NmQ5YWIzY/cPt4EAABhNSURBVHic7d1bqFxX4cfxmZNTY0xL04aExgsVvCIliiZBpY1p6500prUKVTHFNqEiQWOqqVQFL/XWN8UaikYsUvUlorRFi20hogZ9s5ASBTFYSmnSc7QKx7Zm5v+wdTP/uezZe+Z30nPaz+dhmJkze86aty9rrVnT7na7rUUw2dtGBtNut8/YVQAAg9rxwKr5hsXLFinvehXlVLOfZBYAML1wYFW/W19UnYG6KpTZVCe2NBYAMKVYYNVJq06nM/bFU46nIo/KP83MzMgsAGDxZAKrOpgKo2awFnUeq2/Kqvdh+3+qrwUAaCoQWBXvUExZDW2ssXXVaGBjO6lsqcG6Kia0mr4tAMAos1NeX7+u+vRdHp/H6pu16o2q3mxqt9udTmdUY3W7XY0FADQ1VWCNqqLebCp1Op2+wOotrTpvO9bQGOqduyr1FlW7/d9pvKGXaywAoKmRgXXgwIHJ3nFwi1W32/3iF7/497///cknn/zPf/4z6VAzZmdnV65cuWbNmhUrVgxmlsYCAKZXNYP19a9/fdSfxs48FV11+vTpbrd78803z8/Pt9vtDRs2rFq1avDC+fn5+++//9FHH73gggsuvfTS888/v/4H6HQ65ZcTW63WBz/4wZ/85CcVr19YWJibm5ufn1+7dm2n02m32ytWrOj7CIM5pbEAgPomWSKsWVe9e7D+/e9/v+hFLxpaV0eOHHnPe96zdu3a9evXP/bYY6dOnfrZz372lre8pc5IPvShD/34xz8+ffp075NHjx696KKL7r777qGXrFq16vzzz3/kkUfKlir3YJUJNTSnNBYAUFPjwKqza2rwO4OdTmdoXbVarf379//oRz965zvfWTy85557PvWpT/3+97+vM5i77rrrt7/9be+M17vf/e577rmn+qpVq1YV814rVqwosmlw4kpjAQATm2QGq29F77zzzuv9a98erN71u6GeeOKJsq6KQtq3b1/NkXzpS1/asmVL7zNf/vKXX/7yl4+9sJxjKxtrsJ/kFAAwmWaB1e12jxw5snPnzt4VvZ/+9Kflil7f9weLbw6OGcHs7IkTJy688MLi4cMPP1xxMFWfvXv3Fnfm5+fvu+++e++99957733/+99f87MUI5yZmRnVWEOvUl0AQLXGM1g33njjnXfe2buid+DAgaNHj/adzN5XWhVv+IlPfGLTpk3bt29fv379qVOn7rrrrptuuqnmYH7zm98UUXX8+PEtW7Zs3br1hz/8Yc1rB4/jKpcLqzdjAQBUaxBYRYX0ruh1u913vetdn/zkJ/te2bu9fezb7t69+9WvfvXhw4dPnDixfv36O+644x3veEfNIV188cVbt279whe+cPnll/d+GbD+xykGWXHc6GBjqS4AoFrjGaxRK3pDD2fvO7d9qEcfffQVr3hF77FbDz/88Itf/OI6g7nzzjsfeOCBvXv3rl69+tJLL73sssu2bt16zjnn1Ll26LHyNRcKAQAq1A2sskI+/vGPb968efv27evWrTt16tTdd9994MCBip++GTuJtWHDhr5nzjrrrKeeeqrOqK655pprrrmmaLL77rvvK1/5ys6dO59++ummH2owraoXChUYAFCh8QxW34reD37wg7e97W19r2n0C4P//Oc/y/tzc3O33Xbb5s2baw7mqaee+sMf/nDkyJFf//rXDz300MaNG7/xjW/UvHZwr1hFRSkqAKC+WoHV20nFit6nP/3p8plyRW8wWeo01tlnn917/6tf/erGjRvf+9731hnYueeeu3nz5quuuuqWW2557WtfW//rh0NHOLjJvfpayQUADNV4BuuFL3xh3zNnnXXWwsLC4Fmjk/1s8+OPP/7YY4/VfPGuXbt++ctf3n777X/+85+3bdu2bdu2devWNfp3vd8f7H2yzkIhAMBQ4wOrL5KeeOKJ8pm5ubnvfOc7mzZt6nvx0Nga5eKLLy7vdzqd48eP1/8W4cGDB1ut1kMPPfSLX/ziu9/97q5du172spc9+OCDda4dHGT96aveS2q+GAB47mg8g3X22WeXabJ69epbbrnlda973ZVXXjmqq8ZOYl177bXl/RUrVrzkJS+57LLL6o9nfn7+2LFjz3ve8/bs2XPo0KE//vGP9a8dlYO9paWiAICmpv0twscff/zkyZODL6i/RHj99df/4x//uP/++x955JENGzZs2rSp/laqoT8U3eiDjDpidNQlYgsAGGtMYA0W0tatW8s/dTqdP/3pT29/+9uHFlXNxjp69GhxjPtf/vKXCy+8sDj64Y1vfGOd0U/zQ9EVI6w/iSW5AIBBjWewdu3aVdzpdrvFit62bdv6XtPoi4T79u37/ve/f8UVV7z0pS89fvz44cOH9+3b97vf/a7OYKb5oehpvkIIAFCh8bkG11133dVXX7127donn3zy3HPPff3rX1/8WPIEi4OFkydPXnHFFeXDq666am5urua1xbHy5cNGPxTda9T4h05uTfD+AMBzSuMZrKNHj+7YsaN3Re/nP//5li1bBl9Zs7S63e78/Px5551XPPzrX/+6cuXKmoOZ5oeiG7WgmS0AoL7G8z379+8/dOjQgw8+eMEFFxw7duzgwYP79+/ve02jk9x37dpVzmBde+21b3jDG3pPMa22e/fuw4cPr1mz5sSJE6tXr77jjjumWSKseSEAQLXGM1gnT57cvn17WSdXXnnlzTffXNErY8Plc5/73Fvf+tZWq/W+973v+c9//gMPPLBx48b647nkkksuueSSpp9icJC9+9kHbyd7fwDguakqsEadazU/P79mzZriyRMnTvSt6DVtrHa7/eY3v7nVat16662TfopJDB3nBD+So8AAgD6Nlwg//OEP79ixo7h/3XXXbdmy5cYbbyweTjB99YyrP+al/1kAgCWi8RLhZz/72csvv7zVal199dUrV6781a9+ddFFF1XEx1Lukuphm5cCACbTOLDa7fab3vSmVqv1ta99reJnB5dyVxX6zkQdeqaobVgAwAQmOTWq2jJqrMKyGzAAsMTFAmtonXS73aVcLaOGt5THDAAsfXUDq2KaZ+wzS7NXxg6y4pml+YkAgCUiuUQ4+EvPy8XyHTkAsARNFVjPhRZ5LnxGACBrwsCqc1jUEt+AVegbpEOwAIDp5b9F2Gcpp8lSHhsAsHxlAms57mGq3tXe6FMsl48MAJwZiz6DBQDwXDNJYH3mM5/53ve+1/vMoUOHPv/5z+dGBQCwjDX+qZxjx47deuutrVbr9OnTu3fvbrVat99++969e1ut1gc+8IFXvvKVy3TJzO/hAAApjQPrNa95zcGDB2+44YaPfexjMzMzrVarqKvbbrvtVa961XJMKwCArMaB1Wq1rr/++qeffnrv3r0f/ehHi2e++c1vfuQjH1FXAACTb3K/4YYbvv3tbxf3v/Wtb+3Zsyc6KgCAZWySGazCnj171q1b1263d+zYsSzOFK3PfiwAYBqTB1ar1dq5c2e5pb3d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JrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAICw/wMqhRhtLAYpDwAAAABJRU5ErkJggg==
    Open in Gerrit

    Related details

    Attention is currently required from:
    • David Baron
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement is not satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 9
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: David Baron <dba...@chromium.org>
    Gerrit-Comment-Date: Wed, 01 May 2024 20:29:10 +0000
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    David Baron (Gerrit)

    unread,
    May 1, 2024, 4:52:20 PMMay 1
    to Joey Arhar, David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from Joey Arhar

    David Baron voted and added 5 comments

    Votes added by David Baron

    Code-Review+1

    5 comments

    Patchset-level comments
    File-level comment, Patchset 10 (Latest):
    David Baron . resolved

    LGTM with a few comments

    File third_party/blink/renderer/core/html/resources/stylable_select.css
    Line 163, Patchset 4: outline: none;
    padding-bottom: 2px;
    padding-inline-start: 3px;
    padding-inline-end: 3px;
    padding-top: 2px;
    width: 1.2em;
    min-width: 1.2em;
    max-width: 1.2em;
    David Baron . resolved

    The mix of physical and logical (particularly for padding) seems like it's going to go badly in vertical writing mode.

    Maybe try writing it all logical, and add a testcase for vertical-writing-mode selects?

    Joey Arhar

    I changed the px values in this rule to em values, and i added reftests for vertical-rl and vertical-lr. They seem fine to me, but I suppose that in order to be on par with appearance:auto select then maybe we should rotate the icon or move it around.

    David Baron

    Sorry, by physical I meant `padding-bottom` and `padding-top` and `width` and `*-width`, whereas logical is `padding-inline-start` and `padding-inline-end`. I think the `padding-bottom` should be `padding-block-end`, the `padding-top` should be `padding-block-start`, and all the `*width` should be `*inline-size`.

    Joey Arhar

    Thank! I gave it a shot, how does it look?

    David Baron

    looks good (and you caught one that I missed)

    File third_party/blink/web_tests/TestExpectations
    Line 5308, Patchset 9:crbug.com/1511354 [ Linux ] virtual/stylable-select-disabled/external/wpt/html/semantics/forms/the-select-element/stylable-select/native-popup-with-datalist.tentative.html [ Failure ]
    David Baron . unresolved

    why Linux-only?

    Joey Arhar

    Only linux-rel failed. Maybe that's because highdpi tests are only run on linux, but I just ran it on my mac and it passed, so I guess it really is a linux-only issue. Or maybe the testing flag doesn't work on macos even though it seems to be running it properly.

    I mentioned in the layout bug that this only is happening on linux.

    David Baron

    Flag-specific tests are (in general) only run on Linux. (That's why there's no directories with expectations that intersect `flag-specific` with `platform` -- `flag-specific` is an alternative to `platform`.)

    So two things here:

    • the bug number here should probably be the layout bug crbug.com/337904202, or both bugs
    • this should go in `FlagExpectations/highdpi` instead of `TestExpectations`, and without `[ Linux ]`
    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-lr-ref.html
    David Baron . unresolved

    Please also look at these and make sure they're sensible visually. (Given my comments on the style sheet, I'm not so sure that's the case right now.)

    Joey Arhar
    Here is what vertical-rl looks like. The arrow still needs to be rotated and the option elements have non-vertical-writing-mode-friendly rules from the old UA sheet that I will fix in a subsequent patch. Do you have any recommendation for rotating that SVG?
    data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAJYCAIAAAAVFBUnAAAAKXRFWHRjaGVja3N1bQBiMTNjYmEzNTUwNWI0NGRjNjM5ODczNTM4NmQ5YWIzY/cPt4EAABhNSURBVHic7d1bqFxX4cfxmZNTY0xL04aExgsVvCIliiZBpY1p6500prUKVTHFNqEiQWOqqVQFL/XWN8UaikYsUvUlorRFi20hogZ9s5ASBTFYSmnSc7QKx7Zm5v+wdTP/uezZe+Z30nPaz+dhmJkze86aty9rrVnT7na7rUUw2dtGBtNut8/YVQAAg9rxwKr5hsXLFinvehXlVLOfZBYAML1wYFW/W19UnYG6KpTZVCe2NBYAMKVYYNVJq06nM/bFU46nIo/KP83MzMgsAGDxZAKrOpgKo2awFnUeq2/Kqvdh+3+qrwUAaCoQWBXvUExZDW2ssXXVaGBjO6lsqcG6Kia0mr4tAMAos1NeX7+u+vRdHp/H6pu16o2q3mxqt9udTmdUY3W7XY0FADQ1VWCNqqLebCp1Op2+wOotrTpvO9bQGOqduyr1FlW7/d9pvKGXaywAoKmRgXXgwIHJ3nFwi1W32/3iF7/497///cknn/zPf/4z6VAzZmdnV65cuWbNmhUrVgxmlsYCAKZXNYP19a9/fdSfxs48FV11+vTpbrd78803z8/Pt9vtDRs2rFq1avDC+fn5+++//9FHH73gggsuvfTS888/v/4H6HQ65ZcTW63WBz/4wZ/85CcVr19YWJibm5ufn1+7dm2n02m32ytWrOj7CIM5pbEAgPomWSKsWVe9e7D+/e9/v+hFLxpaV0eOHHnPe96zdu3a9evXP/bYY6dOnfrZz372lre8pc5IPvShD/34xz8+ffp075NHjx696KKL7r777qGXrFq16vzzz3/kkUfKlir3YJUJNTSnNBYAUFPjwKqza2rwO4OdTmdoXbVarf379//oRz965zvfWTy85557PvWpT/3+97+vM5i77rrrt7/9be+M17vf/e577rmn+qpVq1YV814rVqwosmlw4kpjAQATm2QGq29F77zzzuv9a98erN71u6GeeOKJsq6KQtq3b1/NkXzpS1/asmVL7zNf/vKXX/7yl4+9sJxjKxtrsJ/kFAAwmWaB1e12jxw5snPnzt4VvZ/+9Kflil7f9weLbw6OGcHs7IkTJy688MLi4cMPP1xxMFWfvXv3Fnfm5+fvu+++e++99957733/+99f87MUI5yZmRnVWEOvUl0AQLXGM1g33njjnXfe2buid+DAgaNHj/adzN5XWhVv+IlPfGLTpk3bt29fv379qVOn7rrrrptuuqnmYH7zm98UUXX8+PEtW7Zs3br1hz/8Yc1rB4/jKpcLqzdjAQBUaxBYRYX0ruh1u913vetdn/zkJ/te2bu9fezb7t69+9WvfvXhw4dPnDixfv36O+644x3veEfNIV188cVbt279whe+cPnll/d+GbD+xykGWXHc6GBjqS4AoFrjGaxRK3pDD2fvO7d9qEcfffQVr3hF77FbDz/88Itf/OI6g7nzzjsfeOCBvXv3rl69+tJLL73sssu2bt16zjnn1Ll26LHyNRcKAQAq1A2sskI+/vGPb968efv27evWrTt16tTdd9994MCBip++GTuJtWHDhr5nzjrrrKeeeqrOqK655pprrrmmaLL77rvvK1/5ys6dO59++ummH2owraoXChUYAFCh8QxW34reD37wg7e97W19r2n0C4P//Oc/y/tzc3O33Xbb5s2baw7mqaee+sMf/nDkyJFf//rXDz300MaNG7/xjW/UvHZwr1hFRSkqAKC+WoHV20nFit6nP/3p8plyRW8wWeo01tlnn917/6tf/erGjRvf+9731hnYueeeu3nz5quuuuqWW2557WtfW//rh0NHOLjJvfpayQUADNV4BuuFL3xh3zNnnXXWwsLC4Fmjk/1s8+OPP/7YY4/VfPGuXbt++ctf3n777X/+85+3bdu2bdu2devWNfp3vd8f7H2yzkIhAMBQ4wOrL5KeeOKJ8pm5ubnvfOc7mzZt6nvx0Nga5eKLLy7vdzqd48eP1/8W4cGDB1ut1kMPPfSLX/ziu9/97q5du172spc9+OCDda4dHGT96aveS2q+GAB47mg8g3X22WeXabJ69epbbrnlda973ZVXXjmqq8ZOYl177bXl/RUrVrzkJS+57LLL6o9nfn7+2LFjz3ve8/bs2XPo0KE//vGP9a8dlYO9paWiAICmpv0twscff/zkyZODL6i/RHj99df/4x//uP/++x955JENGzZs2rSp/laqoT8U3eiDjDpidNQlYgsAGGtMYA0W0tatW8s/dTqdP/3pT29/+9uHFlXNxjp69GhxjPtf/vKXCy+8sDj64Y1vfGOd0U/zQ9EVI6w/iSW5AIBBjWewdu3aVdzpdrvFit62bdv6XtPoi4T79u37/ve/f8UVV7z0pS89fvz44cOH9+3b97vf/a7OYKb5oehpvkIIAFCh8bkG11133dVXX7127donn3zy3HPPff3rX1/8WPIEi4OFkydPXnHFFeXDq666am5urua1xbHy5cNGPxTda9T4h05uTfD+AMBzSuMZrKNHj+7YsaN3Re/nP//5li1bBl9Zs7S63e78/Px5551XPPzrX/+6cuXKmoOZ5oeiG7WgmS0AoL7G8z379+8/dOjQgw8+eMEFFxw7duzgwYP79+/ve02jk9x37dpVzmBde+21b3jDG3pPMa22e/fuw4cPr1mz5sSJE6tXr77jjjumWSKseSEAQLXGM1gnT57cvn17WSdXXnnlzTffXNErY8Plc5/73Fvf+tZWq/W+973v+c9//gMPPLBx48b647nkkksuueSSpp9icJC9+9kHbyd7fwDguakqsEadazU/P79mzZriyRMnTvSt6DVtrHa7/eY3v7nVat16662TfopJDB3nBD+So8AAgD6Nlwg//OEP79ixo7h/3XXXbdmy5cYbbyweTjB99YyrP+al/1kAgCWi8RLhZz/72csvv7zVal199dUrV6781a9+ddFFF1XEx1Lukuphm5cCACbTOLDa7fab3vSmVqv1ta99reJnB5dyVxX6zkQdeqaobVgAwAQmOTWq2jJqrMKyGzAAsMTFAmtonXS73aVcLaOGt5THDAAsfXUDq2KaZ+wzS7NXxg6y4pml+YkAgCUiuUQ4+EvPy8XyHTkAsARNFVjPhRZ5LnxGACBrwsCqc1jUEt+AVegbpEOwAIDp5b9F2Gcpp8lSHhsAsHxlAms57mGq3tXe6FMsl48MAJwZiz6DBQDwXDNJYH3mM5/53ve+1/vMoUOHPv/5z+dGBQCwjDX+qZxjx47deuutrVbr9OnTu3fvbrVat99++969e1ut1gc+8IFXvvKVy3TJzO/hAAApjQPrNa95zcGDB2+44YaPfexjMzMzrVarqKvbbrvtVa961XJMKwCArMaB1Wq1rr/++qeffnrv3r0f/ehHi2e++c1vfuQjH1FXAACTb3K/4YYbvv3tbxf3v/Wtb+3Zsyc6KgCAZWySGazCnj171q1b1263d+zYsSzOFK3PfiwAYBqTB1ar1dq5c2e5pb3d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JrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAICw/wMqhRhtLAYpDwAAAABJRU5ErkJggg==
    David Baron

    Not off the top of my head. Style queries plus `rotate: 90deg` / `rotate: -90deg` seems too heavyweight, as does style queries plus implementing the `<angle>` values of `image-orientation`.

    (My biggest concern with your screenshot led to my comment on the vertical-rl test below.)

    (Seems like this can be handled in a later CL.)

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-rl.tentative.html
    Line 12, Patchset 10 (Latest): writing-mode: vertical-rl;
    David Baron . unresolved

    In this, and the `vertical-lr` test, it's more realistic to put the `writing-mode` on the `html` element. I suggest doing that. Also, probably drop the `dir=rtl` on the `body`.

    That said, it`s probably *also* good to put enough space around the `<select>` so that the popup could fit on any side of it. Then you'll test that the popup opens on the correct side.

    (I noticed this because of your screenshot, where the popup is opening on the wrong side... hopefully because there isn't room to the left of the select.)

    (It makes a bit of a difference since the popup gets constrained to go in the wrong direction.)

    Open in Gerrit

    Related details

    Attention is currently required from:
    • Joey Arhar
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 10
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: Joey Arhar <jar...@chromium.org>
    Gerrit-Comment-Date: Wed, 01 May 2024 20:52:10 +0000
    Gerrit-HasComments: Yes
    Gerrit-Has-Labels: Yes
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    Joey Arhar (Gerrit)

    unread,
    May 1, 2024, 8:03:26 PMMay 1
    to David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from David Baron

    Joey Arhar added 3 comments

    File third_party/blink/web_tests/TestExpectations
    Line 5308, Patchset 9:crbug.com/1511354 [ Linux ] virtual/stylable-select-disabled/external/wpt/html/semantics/forms/the-select-element/stylable-select/native-popup-with-datalist.tentative.html [ Failure ]
    David Baron . resolved

    why Linux-only?

    Joey Arhar

    Only linux-rel failed. Maybe that's because highdpi tests are only run on linux, but I just ran it on my mac and it passed, so I guess it really is a linux-only issue. Or maybe the testing flag doesn't work on macos even though it seems to be running it properly.

    I mentioned in the layout bug that this only is happening on linux.

    David Baron

    Flag-specific tests are (in general) only run on Linux. (That's why there's no directories with expectations that intersect `flag-specific` with `platform` -- `flag-specific` is an alternative to `platform`.)

    So two things here:

    • the bug number here should probably be the layout bug crbug.com/337904202, or both bugs
    • this should go in `FlagExpectations/highdpi` instead of `TestExpectations`, and without `[ Linux ]`
    Joey Arhar

    Oh sorry, I misread which TestExpectations line this was. virtual/stylable-select-disabled/.../native-popup-with-datalist.tentative.html is only disabled on Linux because that test uses the appearance:auto native popup, and it seems that it only gets rendered in a way which is present in the screenshot on Linux. Not sure why it isn't also failing on Windows, but I'd expect it to not work properly on Mac since we can't capture the native popup on that platform.

    The highdpi test which this patch disables is in the right place in FlagExpectations.

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-lr-ref.html
    David Baron . unresolved

    Please also look at these and make sure they're sensible visually. (Given my comments on the style sheet, I'm not so sure that's the case right now.)

    Joey Arhar
    Here is what vertical-rl looks like. The arrow still needs to be rotated and the option elements have non-vertical-writing-mode-friendly rules from the old UA sheet that I will fix in a subsequent patch. Do you have any recommendation for rotating that SVG?
    data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAJYCAIAAAAVFBUnAAAAKXRFWHRjaGVja3N1bQBiMTNjYmEzNTUwNWI0NGRjNjM5ODczNTM4NmQ5YWIzY/cPt4EAABhNSURBVHic7d1bqFxX4cfxmZNTY0xL04aExgsVvCIliiZBpY1p6500prUKVTHFNqEiQWOqqVQFL/XWN8UaikYsUvUlorRFi20hogZ9s5ASBTFYSmnSc7QKx7Zm5v+wdTP/uezZe+Z30nPaz+dhmJkze86aty9rrVnT7na7rUUw2dtGBtNut8/YVQAAg9rxwKr5hsXLFinvehXlVLOfZBYAML1wYFW/W19UnYG6KpTZVCe2NBYAMKVYYNVJq06nM/bFU46nIo/KP83MzMgsAGDxZAKrOpgKo2awFnUeq2/Kqvdh+3+qrwUAaCoQWBXvUExZDW2ssXXVaGBjO6lsqcG6Kia0mr4tAMAos1NeX7+u+vRdHp/H6pu16o2q3mxqt9udTmdUY3W7XY0FADQ1VWCNqqLebCp1Op2+wOotrTpvO9bQGOqduyr1FlW7/d9pvKGXaywAoKmRgXXgwIHJ3nFwi1W32/3iF7/497///cknn/zPf/4z6VAzZmdnV65cuWbNmhUrVgxmlsYCAKZXNYP19a9/fdSfxs48FV11+vTpbrd78803z8/Pt9vtDRs2rFq1avDC+fn5+++//9FHH73gggsuvfTS888/v/4H6HQ65ZcTW63WBz/4wZ/85CcVr19YWJibm5ufn1+7dm2n02m32ytWrOj7CIM5pbEAgPomWSKsWVe9e7D+/e9/v+hFLxpaV0eOHHnPe96zdu3a9evXP/bYY6dOnfrZz372lre8pc5IPvShD/34xz8+ffp075NHjx696KKL7r777qGXrFq16vzzz3/kkUfKlir3YJUJNTSnNBYAUFPjwKqza2rwO4OdTmdoXbVarf379//oRz965zvfWTy85557PvWpT/3+97+vM5i77rrrt7/9be+M17vf/e577rmn+qpVq1YV814rVqwosmlw4kpjAQATm2QGq29F77zzzuv9a98erN71u6GeeOKJsq6KQtq3b1/NkXzpS1/asmVL7zNf/vKXX/7yl4+9sJxjKxtrsJ/kFAAwmWaB1e12jxw5snPnzt4VvZ/+9Kflil7f9weLbw6OGcHs7IkTJy688MLi4cMPP1xxMFWfvXv3Fnfm5+fvu+++e++99957733/+99f87MUI5yZmRnVWEOvUl0AQLXGM1g33njjnXfe2buid+DAgaNHj/adzN5XWhVv+IlPfGLTpk3bt29fv379qVOn7rrrrptuuqnmYH7zm98UUXX8+PEtW7Zs3br1hz/8Yc1rB4/jKpcLqzdjAQBUaxBYRYX0ruh1u913vetdn/zkJ/te2bu9fezb7t69+9WvfvXhw4dPnDixfv36O+644x3veEfNIV188cVbt279whe+cPnll/d+GbD+xykGWXHc6GBjqS4AoFrjGaxRK3pDD2fvO7d9qEcfffQVr3hF77FbDz/88Itf/OI6g7nzzjsfeOCBvXv3rl69+tJLL73sssu2bt16zjnn1Ll26LHyNRcKAQAq1A2sskI+/vGPb968efv27evWrTt16tTdd9994MCBip++GTuJtWHDhr5nzjrrrKeeeqrOqK655pprrrmmaLL77rvvK1/5ys6dO59++ummH2owraoXChUYAFCh8QxW34reD37wg7e97W19r2n0C4P//Oc/y/tzc3O33Xbb5s2baw7mqaee+sMf/nDkyJFf//rXDz300MaNG7/xjW/UvHZwr1hFRSkqAKC+WoHV20nFit6nP/3p8plyRW8wWeo01tlnn917/6tf/erGjRvf+9731hnYueeeu3nz5quuuuqWW2557WtfW//rh0NHOLjJvfpayQUADNV4BuuFL3xh3zNnnXXWwsLC4Fmjk/1s8+OPP/7YY4/VfPGuXbt++ctf3n777X/+85+3bdu2bdu2devWNfp3vd8f7H2yzkIhAMBQ4wOrL5KeeOKJ8pm5ubnvfOc7mzZt6nvx0Nga5eKLLy7vdzqd48eP1/8W4cGDB1ut1kMPPfSLX/ziu9/97q5du172spc9+OCDda4dHGT96aveS2q+GAB47mg8g3X22WeXabJ69epbbrnlda973ZVXXjmqq8ZOYl177bXl/RUrVrzkJS+57LLL6o9nfn7+2LFjz3ve8/bs2XPo0KE//vGP9a8dlYO9paWiAICmpv0twscff/zkyZODL6i/RHj99df/4x//uP/++x955JENGzZs2rSp/laqoT8U3eiDjDpidNQlYgsAGGtMYA0W0tatW8s/dTqdP/3pT29/+9uHFlXNxjp69GhxjPtf/vKXCy+8sDj64Y1vfGOd0U/zQ9EVI6w/iSW5AIBBjWewdu3aVdzpdrvFit62bdv6XtPoi4T79u37/ve/f8UVV7z0pS89fvz44cOH9+3b97vf/a7OYKb5oehpvkIIAFCh8bkG11133dVXX7127donn3zy3HPPff3rX1/8WPIEi4OFkydPXnHFFeXDq666am5urua1xbHy5cNGPxTda9T4h05uTfD+AMBzSuMZrKNHj+7YsaN3Re/nP//5li1bBl9Zs7S63e78/Px5551XPPzrX/+6cuXKmoOZ5oeiG7WgmS0AoL7G8z379+8/dOjQgw8+eMEFFxw7duzgwYP79+/ve02jk9x37dpVzmBde+21b3jDG3pPMa22e/fuw4cPr1mz5sSJE6tXr77jjjumWSKseSEAQLXGM1gnT57cvn17WSdXXnnlzTffXNErY8Plc5/73Fvf+tZWq/W+973v+c9//gMPPLBx48b647nkkksuueSSpp9icJC9+9kHbyd7fwDguakqsEadazU/P79mzZriyRMnTvSt6DVtrHa7/eY3v7nVat16662TfopJDB3nBD+So8AAgD6Nlwg//OEP79ixo7h/3XXXbdmy5cYbbyweTjB99YyrP+al/1kAgCWi8RLhZz/72csvv7zVal199dUrV6781a9+ddFFF1XEx1Lukuphm5cCACbTOLDa7fab3vSmVqv1ta99reJnB5dyVxX6zkQdeqaobVgAwAQmOTWq2jJqrMKyGzAAsMTFAmtonXS73aVcLaOGt5THDAAsfXUDq2KaZ+wzS7NXxg6y4pml+YkAgCUiuUQ4+EvPy8XyHTkAsARNFVjPhRZ5LnxGACBrwsCqc1jUEt+AVegbpEOwAIDp5b9F2Gcpp8lSHhsAsHxlAms57mGq3tXe6FMsl48MAJwZiz6DBQDwXDNJYH3mM5/53ve+1/vMoUOHPv/5z+dGBQCwjDX+qZxjx47deuutrVbr9OnTu3fvbrVat99++969e1ut1gc+8IFXvvKVy3TJzO/hAAApjQPrNa95zcGDB2+44YaPfexjMzMzrVarqKvbbrvtVa961XJMKwCArMaB1Wq1rr/++qeffnrv3r0f/ehHi2e++c1vfuQjH1FXAACTb3K/4YYbvv3tbxf3v/Wtb+3Zsyc6KgCAZWySGazCnj171q1b1263d+zYsSzOFK3PfiwAYBqTB1ar1dq5c2e5pb3d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JrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAICw/wMqhRhtLAYpDwAAAABJRU5ErkJggg==
    David Baron

    Not off the top of my head. Style queries plus `rotate: 90deg` / `rotate: -90deg` seems too heavyweight, as does style queries plus implementing the `<angle>` values of `image-orientation`.

    (My biggest concern with your screenshot led to my comment on the vertical-rl test below.)

    (Seems like this can be handled in a later CL.)

    Joey Arhar

    So the only way is to use style queries? I'm not very familiar with that, what would it even look like?

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-rl.tentative.html
    Line 12, Patchset 10 (Latest): writing-mode: vertical-rl;
    David Baron . unresolved

    In this, and the `vertical-lr` test, it's more realistic to put the `writing-mode` on the `html` element. I suggest doing that. Also, probably drop the `dir=rtl` on the `body`.

    That said, it`s probably *also* good to put enough space around the `<select>` so that the popup could fit on any side of it. Then you'll test that the popup opens on the correct side.

    (I noticed this because of your screenshot, where the popup is opening on the wrong side... hopefully because there isn't room to the left of the select.)

    (It makes a bit of a difference since the popup gets constrained to go in the wrong direction.)

    Joey Arhar

    In this, and the vertical-lr test, it's more realistic to put the writing-mode on the html element. I suggest doing that.

    done

    Also, probably drop the dir=rtl on the body.

    That said, its probably *also* good to put enough space around the<select>` so that the popup could fit on any side of it. Then you'll test that the popup opens on the correct side.

    Without the dir=rtl attribute, the select is rendered on the left side and then the popover opens on the left side and is occluded. Is it really better to add spacing on the left side with random spacer elements than use dir=rtl? Why?

    Open in Gerrit

    Related details

    Attention is currently required from:
    • David Baron
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 10
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: David Baron <dba...@chromium.org>
    Gerrit-Comment-Date: Thu, 02 May 2024 00:03:12 +0000
    Gerrit-HasComments: Yes
    Gerrit-Has-Labels: No
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    David Baron (Gerrit)

    unread,
    May 1, 2024, 9:25:22 PMMay 1
    to Joey Arhar, David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org
    Attention needed from Joey Arhar

    David Baron voted and added 2 comments

    Votes added by David Baron

    Code-Review+1

    2 comments

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-lr-ref.html
    David Baron . unresolved

    Please also look at these and make sure they're sensible visually. (Given my comments on the style sheet, I'm not so sure that's the case right now.)

    Joey Arhar
    Here is what vertical-rl looks like. The arrow still needs to be rotated and the option elements have non-vertical-writing-mode-friendly rules from the old UA sheet that I will fix in a subsequent patch. Do you have any recommendation for rotating that SVG?
    data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAJYCAIAAAAVFBUnAAAAKXRFWHRjaGVja3N1bQBiMTNjYmEzNTUwNWI0NGRjNjM5ODczNTM4NmQ5YWIzY/cPt4EAABhNSURBVHic7d1bqFxX4cfxmZNTY0xL04aExgsVvCIliiZBpY1p6500prUKVTHFNqEiQWOqqVQFL/XWN8UaikYsUvUlorRFi20hogZ9s5ASBTFYSmnSc7QKx7Zm5v+wdTP/uezZe+Z30nPaz+dhmJkze86aty9rrVnT7na7rUUw2dtGBtNut8/YVQAAg9rxwKr5hsXLFinvehXlVLOfZBYAML1wYFW/W19UnYG6KpTZVCe2NBYAMKVYYNVJq06nM/bFU46nIo/KP83MzMgsAGDxZAKrOpgKo2awFnUeq2/Kqvdh+3+qrwUAaCoQWBXvUExZDW2ssXXVaGBjO6lsqcG6Kia0mr4tAMAos1NeX7+u+vRdHp/H6pu16o2q3mxqt9udTmdUY3W7XY0FADQ1VWCNqqLebCp1Op2+wOotrTpvO9bQGOqduyr1FlW7/d9pvKGXaywAoKmRgXXgwIHJ3nFwi1W32/3iF7/497///cknn/zPf/4z6VAzZmdnV65cuWbNmhUrVgxmlsYCAKZXNYP19a9/fdSfxs48FV11+vTpbrd78803z8/Pt9vtDRs2rFq1avDC+fn5+++//9FHH73gggsuvfTS888/v/4H6HQ65ZcTW63WBz/4wZ/85CcVr19YWJibm5ufn1+7dm2n02m32ytWrOj7CIM5pbEAgPomWSKsWVe9e7D+/e9/v+hFLxpaV0eOHHnPe96zdu3a9evXP/bYY6dOnfrZz372lre8pc5IPvShD/34xz8+ffp075NHjx696KKL7r777qGXrFq16vzzz3/kkUfKlir3YJUJNTSnNBYAUFPjwKqza2rwO4OdTmdoXbVarf379//oRz965zvfWTy85557PvWpT/3+97+vM5i77rrrt7/9be+M17vf/e577rmn+qpVq1YV814rVqwosmlw4kpjAQATm2QGq29F77zzzuv9a98erN71u6GeeOKJsq6KQtq3b1/NkXzpS1/asmVL7zNf/vKXX/7yl4+9sJxjKxtrsJ/kFAAwmWaB1e12jxw5snPnzt4VvZ/+9Kflil7f9weLbw6OGcHs7IkTJy688MLi4cMPP1xxMFWfvXv3Fnfm5+fvu+++e++99957733/+99f87MUI5yZmRnVWEOvUl0AQLXGM1g33njjnXfe2buid+DAgaNHj/adzN5XWhVv+IlPfGLTpk3bt29fv379qVOn7rrrrptuuqnmYH7zm98UUXX8+PEtW7Zs3br1hz/8Yc1rB4/jKpcLqzdjAQBUaxBYRYX0ruh1u913vetdn/zkJ/te2bu9fezb7t69+9WvfvXhw4dPnDixfv36O+644x3veEfNIV188cVbt279whe+cPnll/d+GbD+xykGWXHc6GBjqS4AoFrjGaxRK3pDD2fvO7d9qEcfffQVr3hF77FbDz/88Itf/OI6g7nzzjsfeOCBvXv3rl69+tJLL73sssu2bt16zjnn1Ll26LHyNRcKAQAq1A2sskI+/vGPb968efv27evWrTt16tTdd9994MCBip++GTuJtWHDhr5nzjrrrKeeeqrOqK655pprrrmmaLL77rvvK1/5ys6dO59++ummH2owraoXChUYAFCh8QxW34reD37wg7e97W19r2n0C4P//Oc/y/tzc3O33Xbb5s2baw7mqaee+sMf/nDkyJFf//rXDz300MaNG7/xjW/UvHZwr1hFRSkqAKC+WoHV20nFit6nP/3p8plyRW8wWeo01tlnn917/6tf/erGjRvf+9731hnYueeeu3nz5quuuuqWW2557WtfW//rh0NHOLjJvfpayQUADNV4BuuFL3xh3zNnnXXWwsLC4Fmjk/1s8+OPP/7YY4/VfPGuXbt++ctf3n777X/+85+3bdu2bdu2devWNfp3vd8f7H2yzkIhAMBQ4wOrL5KeeOKJ8pm5ubnvfOc7mzZt6nvx0Nga5eKLLy7vdzqd48eP1/8W4cGDB1ut1kMPPfSLX/ziu9/97q5du172spc9+OCDda4dHGT96aveS2q+GAB47mg8g3X22WeXabJ69epbbrnlda973ZVXXjmqq8ZOYl177bXl/RUrVrzkJS+57LLL6o9nfn7+2LFjz3ve8/bs2XPo0KE//vGP9a8dlYO9paWiAICmpv0twscff/zkyZODL6i/RHj99df/4x//uP/++x955JENGzZs2rSp/laqoT8U3eiDjDpidNQlYgsAGGtMYA0W0tatW8s/dTqdP/3pT29/+9uHFlXNxjp69GhxjPtf/vKXCy+8sDj64Y1vfGOd0U/zQ9EVI6w/iSW5AIBBjWewdu3aVdzpdrvFit62bdv6XtPoi4T79u37/ve/f8UVV7z0pS89fvz44cOH9+3b97vf/a7OYKb5oehpvkIIAFCh8bkG11133dVXX7127donn3zy3HPPff3rX1/8WPIEi4OFkydPXnHFFeXDq666am5urua1xbHy5cNGPxTda9T4h05uTfD+AMBzSuMZrKNHj+7YsaN3Re/nP//5li1bBl9Zs7S63e78/Px5551XPPzrX/+6cuXKmoOZ5oeiG7WgmS0AoL7G8z379+8/dOjQgw8+eMEFFxw7duzgwYP79+/ve02jk9x37dpVzmBde+21b3jDG3pPMa22e/fuw4cPr1mz5sSJE6tXr77jjjumWSKseSEAQLXGM1gnT57cvn17WSdXXnnlzTffXNErY8Plc5/73Fvf+tZWq/W+973v+c9//gMPPLBx48b647nkkksuueSSpp9icJC9+9kHbyd7fwDguakqsEadazU/P79mzZriyRMnTvSt6DVtrHa7/eY3v7nVat16662TfopJDB3nBD+So8AAgD6Nlwg//OEP79ixo7h/3XXXbdmy5cYbbyweTjB99YyrP+al/1kAgCWi8RLhZz/72csvv7zVal199dUrV6781a9+ddFFF1XEx1Lukuphm5cCACbTOLDa7fab3vSmVqv1ta99reJnB5dyVxX6zkQdeqaobVgAwAQmOTWq2jJqrMKyGzAAsMTFAmtonXS73aVcLaOGt5THDAAsfXUDq2KaZ+wzS7NXxg6y4pml+YkAgCUiuUQ4+EvPy8XyHTkAsARNFVjPhRZ5LnxGACBrwsCqc1jUEt+AVegbpEOwAIDp5b9F2Gcpp8lSHhsAsHxlAms57mGq3tXe6FMsl48MAJwZiz6DBQDwXDNJYH3mM5/53ve+1/vMoUOHPv/5z+dGBQCwjDX+qZxjx47deuutrVbr9OnTu3fvbrVat99++969e1ut1gc+8IFXvvKVy3TJzO/hAAApjQPrNa95zcGDB2+44YaPfexjMzMzrVarqKvbbrvtVa961XJMKwCArMaB1Wq1rr/++qeffnrv3r0f/ehHi2e++c1vfuQjH1FXAACTb3K/4YYbvv3tbxf3v/Wtb+3Zsyc6KgCAZWySGazCnj171q1b1263d+zYsSzOFK3PfiwAYBqTB1ar1dq5c2e5pb3d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JrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAICw/wMqhRhtLAYpDwAAAABJRU5ErkJggg==
    David Baron

    Not off the top of my head. Style queries plus `rotate: 90deg` / `rotate: -90deg` seems too heavyweight, as does style queries plus implementing the `<angle>` values of `image-orientation`.

    (My biggest concern with your screenshot led to my comment on the vertical-rl test below.)

    (Seems like this can be handled in a later CL.)

    Joey Arhar

    So the only way is to use style queries? I'm not very familiar with that, what would it even look like?

    David Baron

    It's the only thing I could *think* of that's currently implemented in Chrome. But it's a bad idea and we should do something better. Possibly an extension to https://drafts.csswg.org/css-images-4/#bidi-images , or maybe something else.

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-rl.tentative.html
    Line 12, Patchset 10: writing-mode: vertical-rl;
    David Baron . unresolved

    In this, and the `vertical-lr` test, it's more realistic to put the `writing-mode` on the `html` element. I suggest doing that. Also, probably drop the `dir=rtl` on the `body`.

    That said, it`s probably *also* good to put enough space around the `<select>` so that the popup could fit on any side of it. Then you'll test that the popup opens on the correct side.

    (I noticed this because of your screenshot, where the popup is opening on the wrong side... hopefully because there isn't room to the left of the select.)

    (It makes a bit of a difference since the popup gets constrained to go in the wrong direction.)

    Joey Arhar

    In this, and the vertical-lr test, it's more realistic to put the writing-mode on the html element. I suggest doing that.

    done

    Also, probably drop the dir=rtl on the body.

    That said, its probably *also* good to put enough space around the<select>` so that the popup could fit on any side of it. Then you'll test that the popup opens on the correct side.

    Without the dir=rtl attribute, the select is rendered on the left side and then the popover opens on the left side and is occluded. Is it really better to add spacing on the left side with random spacer elements than use dir=rtl? Why?

    David Baron

    Hmmm. I thought your screenshot showed it on the left side -- maybe the screenshot was of the `vertical-lr` testcase?

    In any case, the effect you describe shouldn't be an issue any longer with `writing-mode` on `html`, since that should make the entire document layout `vertical-rl`, which should mean the content starts at the top right instead of the top left.

    And I'm suggesting having spacing because the occlusion behavior is something that you should eventually fix -- the popup should go on the "wrong" side when there isn't room on the right side. So a test that tests which side is the "right" one needs to have enough space on both sides, so that a failure of the test isn't obscured by the occlusion fixup code that I think you'll need to write in the future.

    Open in Gerrit

    Related details

    Attention is currently required from:
    • Joey Arhar
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement satisfiedCode-Review
    • requirement is not satisfiedNo-Unresolved-Comments
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 11
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Attention: Joey Arhar <jar...@chromium.org>
    Gerrit-Comment-Date: Thu, 02 May 2024 01:25:01 +0000
    Gerrit-HasComments: Yes
    Gerrit-Has-Labels: Yes
    satisfied_requirement
    unsatisfied_requirement
    open
    diffy

    Joey Arhar (Gerrit)

    unread,
    May 2, 2024, 11:11:54 AMMay 2
    to David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, Chromium LUCI CQ, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org

    Joey Arhar added 2 comments

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-lr-ref.html
    File-level comment, Patchset 9:
    David Baron . resolved

    Please also look at these and make sure they're sensible visually. (Given my comments on the style sheet, I'm not so sure that's the case right now.)

    Joey Arhar
    Here is what vertical-rl looks like. The arrow still needs to be rotated and the option elements have non-vertical-writing-mode-friendly rules from the old UA sheet that I will fix in a subsequent patch. Do you have any recommendation for rotating that SVG?
    data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAJYCAIAAAAVFBUnAAAAKXRFWHRjaGVja3N1bQBiMTNjYmEzNTUwNWI0NGRjNjM5ODczNTM4NmQ5YWIzY/cPt4EAABhNSURBVHic7d1bqFxX4cfxmZNTY0xL04aExgsVvCIliiZBpY1p6500prUKVTHFNqEiQWOqqVQFL/XWN8UaikYsUvUlorRFi20hogZ9s5ASBTFYSmnSc7QKx7Zm5v+wdTP/uezZe+Z30nPaz+dhmJkze86aty9rrVnT7na7rUUw2dtGBtNut8/YVQAAg9rxwKr5hsXLFinvehXlVLOfZBYAML1wYFW/W19UnYG6KpTZVCe2NBYAMKVYYNVJq06nM/bFU46nIo/KP83MzMgsAGDxZAKrOpgKo2awFnUeq2/Kqvdh+3+qrwUAaCoQWBXvUExZDW2ssXXVaGBjO6lsqcG6Kia0mr4tAMAos1NeX7+u+vRdHp/H6pu16o2q3mxqt9udTmdUY3W7XY0FADQ1VWCNqqLebCp1Op2+wOotrTpvO9bQGOqduyr1FlW7/d9pvKGXaywAoKmRgXXgwIHJ3nFwi1W32/3iF7/497///cknn/zPf/4z6VAzZmdnV65cuWbNmhUrVgxmlsYCAKZXNYP19a9/fdSfxs48FV11+vTpbrd78803z8/Pt9vtDRs2rFq1avDC+fn5+++//9FHH73gggsuvfTS888/v/4H6HQ65ZcTW63WBz/4wZ/85CcVr19YWJibm5ufn1+7dm2n02m32ytWrOj7CIM5pbEAgPomWSKsWVe9e7D+/e9/v+hFLxpaV0eOHHnPe96zdu3a9evXP/bYY6dOnfrZz372lre8pc5IPvShD/34xz8+ffp075NHjx696KKL7r777qGXrFq16vzzz3/kkUfKlir3YJUJNTSnNBYAUFPjwKqza2rwO4OdTmdoXbVarf379//oRz965zvfWTy85557PvWpT/3+97+vM5i77rrrt7/9be+M17vf/e577rmn+qpVq1YV814rVqwosmlw4kpjAQATm2QGq29F77zzzuv9a98erN71u6GeeOKJsq6KQtq3b1/NkXzpS1/asmVL7zNf/vKXX/7yl4+9sJxjKxtrsJ/kFAAwmWaB1e12jxw5snPnzt4VvZ/+9Kflil7f9weLbw6OGcHs7IkTJy688MLi4cMPP1xxMFWfvXv3Fnfm5+fvu+++e++99957733/+99f87MUI5yZmRnVWEOvUl0AQLXGM1g33njjnXfe2buid+DAgaNHj/adzN5XWhVv+IlPfGLTpk3bt29fv379qVOn7rrrrptuuqnmYH7zm98UUXX8+PEtW7Zs3br1hz/8Yc1rB4/jKpcLqzdjAQBUaxBYRYX0ruh1u913vetdn/zkJ/te2bu9fezb7t69+9WvfvXhw4dPnDixfv36O+644x3veEfNIV188cVbt279whe+cPnll/d+GbD+xykGWXHc6GBjqS4AoFrjGaxRK3pDD2fvO7d9qEcfffQVr3hF77FbDz/88Itf/OI6g7nzzjsfeOCBvXv3rl69+tJLL73sssu2bt16zjnn1Ll26LHyNRcKAQAq1A2sskI+/vGPb968efv27evWrTt16tTdd9994MCBip++GTuJtWHDhr5nzjrrrKeeeqrOqK655pprrrmmaLL77rvvK1/5ys6dO59++ummH2owraoXChUYAFCh8QxW34reD37wg7e97W19r2n0C4P//Oc/y/tzc3O33Xbb5s2baw7mqaee+sMf/nDkyJFf//rXDz300MaNG7/xjW/UvHZwr1hFRSkqAKC+WoHV20nFit6nP/3p8plyRW8wWeo01tlnn917/6tf/erGjRvf+9731hnYueeeu3nz5quuuuqWW2557WtfW//rh0NHOLjJvfpayQUADNV4BuuFL3xh3zNnnXXWwsLC4Fmjk/1s8+OPP/7YY4/VfPGuXbt++ctf3n777X/+85+3bdu2bdu2devWNfp3vd8f7H2yzkIhAMBQ4wOrL5KeeOKJ8pm5ubnvfOc7mzZt6nvx0Nga5eKLLy7vdzqd48eP1/8W4cGDB1ut1kMPPfSLX/ziu9/97q5du172spc9+OCDda4dHGT96aveS2q+GAB47mg8g3X22WeXabJ69epbbrnlda973ZVXXjmqq8ZOYl177bXl/RUrVrzkJS+57LLL6o9nfn7+2LFjz3ve8/bs2XPo0KE//vGP9a8dlYO9paWiAICmpv0twscff/zkyZODL6i/RHj99df/4x//uP/++x955JENGzZs2rSp/laqoT8U3eiDjDpidNQlYgsAGGtMYA0W0tatW8s/dTqdP/3pT29/+9uHFlXNxjp69GhxjPtf/vKXCy+8sDj64Y1vfGOd0U/zQ9EVI6w/iSW5AIBBjWewdu3aVdzpdrvFit62bdv6XtPoi4T79u37/ve/f8UVV7z0pS89fvz44cOH9+3b97vf/a7OYKb5oehpvkIIAFCh8bkG11133dVXX7127donn3zy3HPPff3rX1/8WPIEi4OFkydPXnHFFeXDq666am5urua1xbHy5cNGPxTda9T4h05uTfD+AMBzSuMZrKNHj+7YsaN3Re/nP//5li1bBl9Zs7S63e78/Px5551XPPzrX/+6cuXKmoOZ5oeiG7WgmS0AoL7G8z379+8/dOjQgw8+eMEFFxw7duzgwYP79+/ve02jk9x37dpVzmBde+21b3jDG3pPMa22e/fuw4cPr1mz5sSJE6tXr77jjjumWSKseSEAQLXGM1gnT57cvn17WSdXXnnlzTffXNErY8Plc5/73Fvf+tZWq/W+973v+c9//gMPPLBx48b647nkkksuueSSpp9icJC9+9kHbyd7fwDguakqsEadazU/P79mzZriyRMnTvSt6DVtrHa7/eY3v7nVat16662TfopJDB3nBD+So8AAgD6Nlwg//OEP79ixo7h/3XXXbdmy5cYbbyweTjB99YyrP+al/1kAgCWi8RLhZz/72csvv7zVal199dUrV6781a9+ddFFF1XEx1Lukuphm5cCACbTOLDa7fab3vSmVqv1ta99reJnB5dyVxX6zkQdeqaobVgAwAQmOTWq2jJqrMKyGzAAsMTFAmtonXS73aVcLaOGt5THDAAsfXUDq2KaZ+wzS7NXxg6y4pml+YkAgCUiuUQ4+EvPy8XyHTkAsARNFVjPhRZ5LnxGACBrwsCqc1jUEt+AVegbpEOwAIDp5b9F2Gcpp8lSHhsAsHxlAms57mGq3tXe6FMsl48MAJwZiz6DBQDwXDNJYH3mM5/53ve+1/vMoUOHPv/5z+dGBQCwjDX+qZxjx47deuutrVbr9OnTu3fvbrVat99++969e1ut1gc+8IFXvvKVy3TJzO/hAAApjQPrNa95zcGDB2+44YaPfexjMzMzrVarqKvbbrvtVa961XJMKwCArMaB1Wq1rr/++qeffnrv3r0f/ehHi2e++c1vfuQjH1FXAACTb3K/4YYbvv3tbxf3v/Wtb+3Zsyc6KgCAZWySGazCnj171q1b1263d+zYsSzOFK3PfiwAYBqTB1ar1dq5c2e5pb3d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JrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAICw/wMqhRhtLAYpDwAAAABJRU5ErkJggg==
    David Baron

    Not off the top of my head. Style queries plus `rotate: 90deg` / `rotate: -90deg` seems too heavyweight, as does style queries plus implementing the `<angle>` values of `image-orientation`.

    (My biggest concern with your screenshot led to my comment on the vertical-rl test below.)

    (Seems like this can be handled in a later CL.)

    Joey Arhar

    So the only way is to use style queries? I'm not very familiar with that, what would it even look like?

    David Baron

    It's the only thing I could *think* of that's currently implemented in Chrome. But it's a bad idea and we should do something better. Possibly an extension to https://drafts.csswg.org/css-images-4/#bidi-images , or maybe something else.

    Joey Arhar

    Ok, I mentioned that we should fix this here: https://issues.chromium.org/issues/338332443

    File third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-rl.tentative.html
    Line 12, Patchset 10: writing-mode: vertical-rl;
    David Baron . resolved

    In this, and the `vertical-lr` test, it's more realistic to put the `writing-mode` on the `html` element. I suggest doing that. Also, probably drop the `dir=rtl` on the `body`.

    That said, it`s probably *also* good to put enough space around the `<select>` so that the popup could fit on any side of it. Then you'll test that the popup opens on the correct side.

    (I noticed this because of your screenshot, where the popup is opening on the wrong side... hopefully because there isn't room to the left of the select.)

    (It makes a bit of a difference since the popup gets constrained to go in the wrong direction.)

    Joey Arhar

    In this, and the vertical-lr test, it's more realistic to put the writing-mode on the html element. I suggest doing that.

    done

    Also, probably drop the dir=rtl on the body.

    That said, its probably *also* good to put enough space around the<select>` so that the popup could fit on any side of it. Then you'll test that the popup opens on the correct side.

    Without the dir=rtl attribute, the select is rendered on the left side and then the popover opens on the left side and is occluded. Is it really better to add spacing on the left side with random spacer elements than use dir=rtl? Why?

    David Baron

    Hmmm. I thought your screenshot showed it on the left side -- maybe the screenshot was of the `vertical-lr` testcase?

    In any case, the effect you describe shouldn't be an issue any longer with `writing-mode` on `html`, since that should make the entire document layout `vertical-rl`, which should mean the content starts at the top right instead of the top left.

    And I'm suggesting having spacing because the occlusion behavior is something that you should eventually fix -- the popup should go on the "wrong" side when there isn't room on the right side. So a test that tests which side is the "right" one needs to have enough space on both sides, so that a failure of the test isn't obscured by the occlusion fixup code that I think you'll need to write in the future.

    Joey Arhar

    This is what vertical-rl looks like without dir=rtl. It still doesn't quite seem right since it is at the bottom instead of the top, but perhaps we should follow up on this. I am filing a followup: https://issues.chromium.org/issues/338332443

    I am removing the dir attribute from the tests

    data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAJYCAIAAAAVFBUnAAAAKXRFWHRjaGVja3N1bQAwMmNjMTBmNTU3Y2I2YmFlYTZmYWRmYWVjNjVlZGI2Y8b49PwAABbMSURBVHic7d1djFxl4cfxme0WXLVBt3EsCVqDmDQm1kQLqIHKi0GsEqGkGhJIVUAbtQmk1IUQTYj1lSsvIMUSTYiWxIvGl4pKRKRKNXpjYoBUGnWxJqXdFyjGWl5mvTj//3GY2Zk9O/Pr7lY/n4vJzHTOmWd79c3zPHNOfWZmpgYAQM7QYg8AAOC/jcACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhAgsAIExgAQCECSwAgDCBBQAQJrAAAMIEFgBAmMACAAgTWAAAYQILACBMYAEAhAksAIAwgQUAECawAADCBBYAQJjAAgAIE1gAAGECCwAgTGABAIQJLACAMIEFABAmsAAAwgQWAECYwAIACBNYAABhw4s9AACAWq1Wm5mZ6e/Aer2eHsug6n3/MQAA/VmA/Fjc6hJYAMBJt7i9sfCxJbAAgJNlCWbGwsSWwAIAwk6JujippSWwAICY/roiUiP9BdNJyiyBBQAEVCyK4mMLtsm9Yj/FM0tgAQCD6p0TbVG1YO1RZlOV2Mo2lsACAPpXJa2azeacHx4wSHrkUflPQ0NDC5ZZAgsA6FPvYCp0m8E6qQXSNmXV+rL+/3ofO+gABBYA0IceCVFMWc3aWHPW1bzKZM5OKluqs66KCa35nrYit8oBAOatel21aTs8PtHTNmvVGlWt2VSv15vNZrfGmpmZGbCxBBYAMD/dqqg1m0rNZrMtsFpLq8pp5zRrDLXOXZVai6pe/791vFkPH7CxBBYAMA+966otrV566aVnnnnmxIkTL7744oKP9GWGh4dPP/3017zmNV/4whfa1g0HWRP82te+NvvXDTBUAOB/S8WZp3LWanp6ul6vn3nmmSMjIws1xtkdP358ampqenq6Vqvt2LGjXq8vW7asc92w88Ae7TU2Ntbtn7pu7wIAaDVnXZUTV+Xzf/3rX6Ojo4teV7VabWRkZHR09MSJE+UCZVmB5WeCC5cCCwCYW5X4aPuRYLPZbDabS6GuCiMjI0VUdf6qsZRqLIEFAPSjW5q0zg8t0tC6ar3wabdfMkaGLbAAgDnM2Rxtvx/sXH1bUjpHWP0PrEhgAQDz1rl1qfNy7UszsDq7qvPap4OPXGABAL101ka3/mjd3r6QN3XuQ+tW924fmPOdHgQWANC/WS/O3nbd9iVlYS4rL7AAgK56T+T0aJSlWVeFisMeZBJLYAEAVVXsj1NiibDtSa1Wu+222+69997Wd3bt2nX77bf3cX5XcgcAZlexkDq3t58SddU64Hq9/thjj9155521Wu2ll17asmVLrVa75557Pv3pT9dqteuuu27NmjWtH57zKwQWAFBJ78XB1pdLua4K5TjLWnrrW9+6c+fOLVu2fOYznynuolPU1T333FPWVXUCCwCYxbwiadauWpqZ1TnIer1ePF5//fUvvPDC1q1bixmsWq1211133XDDDZ1nmHMSyx4sAGB+eq8GLv1JrB7D3rJly1133VW8c/fdd5elNV9msACAuVW81nm3S3cuNa1LhG0zUp/61KcajUa9Xr/qqqvKD1fZd9VKYAEA7Xq0UcXLoJ8SddX5ftFbRVr16Ko5k8sSIQCQcUr8kHBhfvMosACAOXS75NWptSzYqfpf4WbPAMDJUqUzln5pVR9h33+FwAIAMk6JJcLCyb6lj8ACAOanx5raKX0vwuBap8ACAF6mv+uFniqN1fc45/XfIrAAgEq6JcWpklatqo+5v79FYAEAfapyuawlaAGGLbAAgHnofdvBWW8IvWSdvFtWCywAIOAUWh8snNQBCywAoH+z1snMzMxSzqxuwwuOWWABAF31mOaZ852l2VhzDrLHO9X/IoEFAAzk1Np31erkjXw4eC4A4H/BqVVR1U1PTz/yyCNPP/30qlWr3vve965cubLvUwksAKCqKheLWuIbsAptg5yZmXn00Uc3bdo0OjraaDSOHDkyOTm5Z8+e9evX1+v1Ps4vsACAvAVorOnp6V/84heHDx9etWrVxRdfPDo6WvHAWcc2NjZ23333vf/976/VavV6/Sc/+cnY2NhvfvOb/sZmDxYA8B/zCqPee5iqnKrZbL7Y4qMf/WjFr963b9/ZZ589Njb23e9+d2xs7Oyzz37kkUeqj7xznM8999xll11WjvkDH/jAs88+298JBRYAsGiuvfba0047bXmL733ve6tXr/7gBz8457Hbtm27//77Dx48uH///oMHD+7evXv79u2DDGZ4ePipp54qX/79738fGuo/kywRAgCLY+/evfv3729d2tuwYcMDDzxQ5dhjx45dfvnlrQfefPPNgwzms5/97Lvf/e4NGzY0Go3JyckHHnjgc5/7XN9nE1gAQMZ891198YtfPO+881rf2bFjxznnnFPl2OHh4fHx8dWrVxcvDx061N+E08zMTLGN/ROf+MSaNWu+//3vP/XUU41G41vf+laxH6s/AgsAWBxbt24tnkxPTz/00EMPPvjggw8++JGPfKTKsTfddNO6des+9KEPNRqNiYmJvXv33nrrrYMM5umnnz7nnHNuueWW8meDhw4dOuuss/o7m8ACABbHo48+WkTVgQMHzjvvvPXr13/nO9+peOyNN964Zs2aPXv2jI+PNxqN8geAfXvTm97U9s7y5cv/+c9/9nc2gQUALI4LLrhg/fr1d9xxx6WXXrps2bJ5HXv48OG3vOUtY2Nj5TuDTDjVarWjR48Wc1f1ev2ZZ57ZuXPnunXr+j6bwAIA+jfI9a5279798MMPb9269VWvetXFF198ySWXrF+/fsWKFVWOPfPMM9veWb58+fPPP9/3YF796lcXdVWv11esWLFjx453vOMdGzdu7O9sAgsA6F+9Xu+7sa655pprrrmmmHx66KGHvvzlL1955ZUvvPBClWOfe+658vnU1NTdd9997rnn9jeMUutF2ycnJ48ePdr3qQQWALA4nn/++d///vf79u371a9+9cQTT6xdu/brX/96xWOLCafy+Ve+8pW1a9deffXVfQ/mkksuKZ7U6/Vms/mnP/3psssu6/tsAgsAWBxnnHHGueeeu3Hjxi996Utvf/vbB7mw5+Tk5JEjRwYZzHXXXVfOYA0PD5911lllcvVBYAEAi2Pz5s0/+9nPvvnNbz755JMXXXTRRRdd9LrXva7isRdccEH5vNlsHjhwYMBfEX784x8/duzYL3/5y8OHD69cufKd73ynK7kDAItvvvuxdu7cWavVnnjiiZ/+9Kf33nvv5s2b3/zmN//xj3+scuzHPvax8vmyZcve8IY39DfhVM5a/e53v7vqqqsajcZf/vKXN77xjZOTkz/84Q/PP//8Ps7pXoQAwGKanp5+/PHHTzvttE9+8pNPPvlk9T1YN9xww6ZNm1auXHnixIkzzjhj3bp1g0w41Wq17du379q16w9/+MPrX//6xx57bOfOndu2bev7bGawAID/GORXga0nKfT+2L59+z784Q+vXLmy0WgcOXJkYmLiBz/4QcWv+O1vf1tcxv3Pf/7z6tWrJyYmfvzjH7/rXe+qPry2NycmJlpvMn3llVfefvvtFQfTyQwWANCn1kwpq6V8nDOwtm3bdv/99x88eHD//v0HDx7cvXv39u3bK371zTff/O1vf/vxxx9ftWrVgQMHdu3aVfFmz93GOTMzMz09XY55fHz89NNPrziYTgILAAiYM6c6HTt27PLLLy9fbtiw4dlnn6147NGjR6+44ory5caNG6empuY7gEIx8muvvba8rOj1119//vnn33LLLf2d0BIhADAPxQJi5zJi+U4xITQ0NFR8rPfZhoeHx8fHV69eXbw8dOhQ9X1UxYTTa1/72uLlX//61+oTTsUIW+fY6vX6bbfddumll9ZqtauvvnpkZOTnP//52972tj6qsSCwAICBtPZW6wLcnHVy0003rVu3rthKNTExsXfv3ltvvbXil27evPmKK6749a9/Xfyi8Ec/+tE3vvGNiqOddYRDQ0PFFq6vfvWrVQbfm8ACAOY2r83vRZ0MDQ0NDQ0dP358ZGRk1o/deOONa9as2bNnz/j4eKPRuO+++6pfy+rzn//8+973vlqttmnTple84hUPP/zw2rVrex9y/PjxYuJqvguafcSWwAIAuurRVZ3/NDQ01Gw2y7pqNpvDw8NTU1Ojo6PdGuvCCy+88MIL+xvYe97znlqtduedd1b5/PHjx6empoaHh4uxta5mdp65x5dWHJ7AAgD6N2uBlaX1yle+8h//+Mff/va3RRrdywwPD69YsaJer99xxx2dq4SdTzqLqnpgBa51AQD8N2lrg/Jl8aTH48zMTLPZLO5dUyjeaXtSKA/p9kVz6pZErfFUzFEVK4NtT4q5q9bd7r0f59VbZrAAgHlo/SFhj1XCIl/K520h1ZZZxWN5PaoyXGYtrVlnmDovbVVmU9lVbb1VrhV2nryPfVptBBYAMJDWazS05lHrJRuazeayZcvKTxYTXW2NNa9JrG5Le61dVV6RoXWmqi2/us1ODUhgAQCV9P4hYWtmFYVUlE1ZV8Vj+bLbUmPfS4Sdj60zVa0zWN12X/X+lnkRWADAy7SFVI/LivZQrhWWvVU0Vq1Wq15XfS8R9pjKmnVlsPe3zPrOHFlmkzsA0Kb3Pvcem9xnfVkuCBaLg4PUVaF6Y5V11Tqh1e12hL03ts8rsMxgAQAZs059td45p1g3LNqrbbN85/b26it3Vba6d2666jxPkBksAKBdtxmsildt6P2yx+Os395NZ2PN+Vhx4mrwa2L9G24bacRHCCxQAAAAAElFTkSuQmCC

    Open in Gerrit

    Related details

    Attention set is empty
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement satisfiedCode-Review
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 11
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Comment-Date: Thu, 02 May 2024 15:11:42 +0000
    Gerrit-HasComments: Yes
    Gerrit-Has-Labels: No
    satisfied_requirement
    open
    diffy

    Chromium LUCI CQ (Gerrit)

    unread,
    May 2, 2024, 11:56:48 AMMay 2
    to Joey Arhar, David Baron, Daniel Cheng, Blink W3C Test Autoroller, Alexis Menard, AyeAye, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org

    Chromium LUCI CQ submitted the change with unreviewed changes

    Unreviewed changes

    11 is the latest approved patch-set.
    The change was submitted with unreviewed changes in the following files:

    ```
    The name of the file: third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-rl-ref.html
    Insertions: 0, Deletions: 1.

    @@ -7,7 +7,6 @@
    }
    </style>

    -<body dir=rtl>
    <div id=container class=stylable-select-container>
    <button class=stylable-select-button popovertarget=popover id=button>
    <span class=stylable-select-selectedoption>one</span>
    ```
    ```
    The name of the file: third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-rl.tentative.html
    Insertions: 0, Deletions: 1.

    @@ -15,7 +15,6 @@
    }
    </style>

    -<body dir=rtl>
    <select>
    <option>one</option>
    <option>two</option>
    ```

    Change information

    Commit message:
    Add content to appearance:base-select fallback button

    This patch adds extra content and styling to the fallback button in the
    UA shadowroot of <select> which gets rendered when it is
    appearance:base-select and the author does not provide a <button>
    element to replace it with.

    In order to do this, this patch also adds 3 pseudo-elements to the
    <select> element:
    - ::select-fallback-button which targets the fallback <button>
    - ::select-fallback-button-icon which targets the <div> inside the
    fallback <button> which renders an svg as its background-image

    - ::select-fallback-selectedoption which targets the <span> inside the
      fallback <button> which gets the selected <option>'s text content
    copied into it.

    The CSS and contents are all exactly the same as they are in
    <selectlist>. <selectlist> also has the same pseudo elements.

    This patch also changes some tests to inherit from PageTestBase. Adding
    the svg background-image caused a scheduling crash in v8 with something
    about microtask queues. I don't know what PageTestBase does differently
    from these tests which are making their own TaskEnvironment, but
    PageTestBase does it in a way which doesn't make the test crash.
    Bug: 1511354
    Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Reviewed-by: David Baron <dba...@chromium.org>
    Commit-Queue: Joey Arhar <jar...@chromium.org>
    Cr-Commit-Position: refs/heads/main@{#1295509}
    Files:
    • M third_party/blink/renderer/core/css/css_selector.cc
    • M third_party/blink/renderer/core/css/css_selector.h
    • M third_party/blink/renderer/core/css/parser/css_selector_parser.cc
    • M third_party/blink/renderer/core/css/rule_feature_set.cc
    • M third_party/blink/renderer/core/css/rule_set.cc
    • M third_party/blink/renderer/core/css/selector_checker.cc
    • M third_party/blink/renderer/core/dom/element.cc
    • M third_party/blink/renderer/core/editing/surrounding_text_test.cc
    • M third_party/blink/renderer/core/editing/text_offset_mapping_test.cc
    • M third_party/blink/renderer/core/frame/web_frame_test.cc
    • M third_party/blink/renderer/core/html/forms/external_popup_menu_test.cc
    • M third_party/blink/renderer/core/html/forms/internal_popup_menu_test.cc
    • M third_party/blink/renderer/core/html/forms/select_type.cc
    • M third_party/blink/renderer/core/html/resources/stylable_select.css
    • M third_party/blink/renderer/core/html/shadow/shadow_element_names.json5
    • M third_party/blink/renderer/core/inspector/inspector_trace_events.cc
    • M third_party/blink/web_tests/FlagExpectations/highdpi
    • M third_party/blink/web_tests/TestExpectations
    • M third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/resources/stylable-select-styles.css
    • R third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-custom-button-no-datalist-ref.html
    • M third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-custom-button-no-datalist.tentative.html
    • M third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-no-button-custom-datalist.tentative.html
    • C third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-no-button-no-datalist-ref.html
    • M third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-no-button-no-datalist.tentative.html
    • C third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-lr-ref.html
    • A third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-lr.tentative.html
    • C third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-rl-ref.html
    • A third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/stylable-select/select-appearance-writing-mode-vertical-rl.tentative.html
    • M third_party/blink/web_tests/fast/forms/suggested-value-after-empty-suggested-value-expected.txt
    • M third_party/blink/web_tests/fast/forms/suggested-value-expected.txt
    • M third_party/blink/web_tests/inspector-protocol/dom-snapshot/dom-snapshot-getSnapshot-input-value-expected.txt
    • M third_party/blink/web_tests/platform/linux/virtual/date-input-inline-block-disabled/fast/forms/suggested-value-expected.txt
    Change size: L
    Delta: 32 files changed, 454 insertions(+), 94 deletions(-)
    Branch: refs/heads/main
    Submit Requirements:
    • requirement satisfiedCode-Review: +1 by David Baron
    Open in Gerrit
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: merged
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 13
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: Chromium LUCI CQ <chromiu...@luci-project-accounts.iam.gserviceaccount.com>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    open
    diffy
    satisfied_requirement

    Blink W3C Test Autoroller (Gerrit)

    unread,
    May 3, 2024, 9:09:49 PMMay 3
    to Chromium LUCI CQ, David Baron, Daniel Cheng, Alexis Menard, AyeAye, blink-revi...@chromium.org, blink-re...@chromium.org, devtools-re...@chromium.org, blink-re...@chromium.org, blink-...@chromium.org, blink-rev...@chromium.org, blink-revie...@chromium.org, apavlo...@chromium.org

    Message from Blink W3C Test Autoroller

    The WPT PR for this CL has been merged upstream! https://github.com/web-platform-tests/wpt/pull/45774

    Open in Gerrit

    Related details

    Attention set is empty
    Submit Requirements:
    • requirement satisfiedCode-Coverage
    • requirement satisfiedCode-Review
    Inspect html for hidden footers to help with email filtering. To unsubscribe visit settings. DiffyGerrit
    Gerrit-MessageType: comment
    Gerrit-Project: chromium/src
    Gerrit-Branch: main
    Gerrit-Change-Id: Iaf362dd1253f4dd9e5984cc3301c31e9e9ae558c
    Gerrit-Change-Number: 5464171
    Gerrit-PatchSet: 13
    Gerrit-Owner: Joey Arhar <jar...@chromium.org>
    Gerrit-Reviewer: Chromium LUCI CQ <chromiu...@luci-project-accounts.iam.gserviceaccount.com>
    Gerrit-Reviewer: David Baron <dba...@chromium.org>
    Gerrit-Reviewer: Joey Arhar <jar...@chromium.org>
    Gerrit-CC: Alexis Menard <alexis...@intel.com>
    Gerrit-CC: Blink W3C Test Autoroller <blink-w3c-te...@chromium.org>
    Gerrit-CC: Daniel Cheng <dch...@chromium.org>
    Gerrit-Comment-Date: Sat, 04 May 2024 01:09:37 +0000
    Gerrit-HasComments: No
    Gerrit-Has-Labels: No
    satisfied_requirement
    open
    diffy
    Reply all
    Reply to author
    Forward
    0 new messages