From 4255cab389961f391a614a7effd488184ba55898 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Thu, 24 Jan 2019 15:47:12 +0100 Subject: [PATCH 01/38] Define which elements can be which kinds of widgets for CSS 'appearance' Also: - Add appearance to the UA stylesheet - Document remaining issues (issue #7050) - Hook into CSS UI's 'native appearance' term --- source | 403 +++++++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 391 insertions(+), 12 deletions(-) diff --git a/source b/source index cdf8c070818..ef3cd72c90e 100644 --- a/source +++ b/source @@ -3444,7 +3444,23 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute 'padding-block-end', 'padding-inline-start', and 'padding-inline-end' properties -
  • The 'border-block-start-width' property
    • +
  • The 'border-block-start-width', + 'border-block-end-width', + 'border-inline-start-width', + 'border-inline-end-width', + 'border-block-start-style', + 'border-block-end-style', + 'border-inline-start-style', + 'border-inline-end-style', + 'border-block-start-color', + 'border-block-end-color', + 'border-inline-start-color', + 'border-inline-end-color', + 'border-start-start-radius', + 'border-start-end-radius', + 'border-end-start-radius', and + 'border-end-end-radius' + properties
  • The 'block-size' property
  • The 'inline-size' property
  • The 'inset-block-start' property
    • @@ -3487,9 +3503,27 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute spec=CSSBG>

    CSS Backgrounds and Borders also defines the following border properties:

    @@ -3678,6 +3712,12 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
  • The 'word-spacing' property
    • +

    The following features are defined in CSS User Interface:

    + + +

    The following features are defined in CSS Writing Modes:

    -

    ...then return the appropriate widget with the include background - properties flag set to false, authorProps set to authorProps, - expected set to textfield, and - fallback set to none.

    +

    ...then return the appropriate widget with authorProps set to + authorProps, expected set to textfield, and fallback set to none.

  • If localName is "input" and inputState is Search, then return the appropriate - widget with the include background properties flag set to true, - authorProps set to authorProps, expected set to searchfield, and fallback set to none.

    • + widget with authorProps set to authorProps, expected + set to searchfield, and fallback + set to none.

  • If localName is "input" and inputState is @@ -118907,28 +118906,25 @@ input[type=image i][align=bottom i], object[align=bottom i] {

  • Assert: selectState is drop-down box.

  • If computedAppearance is 'button', then return the appropriate - widget with the include background properties flag set to true, - authorProps set to authorProps, expected set to button, and fallback set to none.

    • + widget with authorProps set to authorProps, expected + set to button, and fallback set to + none.

  • If computedAppearance is 'menulist-button', then return menulist-button.

    • -

  • Return the appropriate widget with the include background - properties flag set to true, authorProps set to authorProps, - expected set to menulist, and - fallback set to

    Return the appropriate widget with authorProps set to + authorProps, expected set to menulist, and fallback set to menulist-button.

  • If localName is "textarea", then return the - appropriate widget with the include background properties flag set to - false, authorProps set to authorProps, expected set to textarea, and fallback set to none.

    • + appropriate widget with authorProps set to authorProps, + expected set to textarea, and + fallback set to none.

  • If localName is "progress", then return none.

    • -

    The appropriate widget, given a boolean include background properties - flag, a map of properties authorProps, and an - expected kind of widget expected, and a fallback kind of - widget fallback, is as follows:

    +

    The appropriate widget, given a map of properties + authorProps, and an expected kind of widget expected, and a + fallback kind of widget fallback, is as follows:

      -

    1. Let anyValueProps be the relevant any-value border - properties.

      2. - -

    2. Let nonInitialValueProps be the relevant non-initial value border - properties.

      3. - -

    3. If include background properties is true, then append all items of the - relevant any-value background properties to anyValueProps, and append all - items of the relevant non-initial value background properties to - nonInitialValueProps.

      4. -
    4. -

      For each prop of anyValueProps:

      +

      For each prop of the relevant any-value properties:

      1. If authorProps[prop] exists, then return fallback.

      -
    5. -

      For each prop of nonInitialValueProps:

      +

      For each prop of the relevant non-initial value properties:

      1. If authorProps[prop] exists and has a value that is not the @@ -118986,9 +118969,10 @@ input[type=image i][align=bottom i], object[align=bottom i] {

      -

      The relevant any-value border properties are:

      +

      The relevant any-value properties are:

        +
      • 'background-color'
      • 'border-top-color'
      • 'border-top-style'
      • 'border-top-width'
        • @@ -119015,9 +118999,16 @@ input[type=image i][align=bottom i], object[align=bottom i] {
      • 'border-inline-end-width'
      -

      The relevant non-initial value border properties are:

      +

      The relevant non-initial value properties are:

        +
      • 'background-image'
        • +
      • 'background-repeat'
        • +
      • 'background-attachment'
        • +
      • 'background-position'
        • +
      • 'background-clip'
        • +
      • 'background-origin'
        • +
      • 'background-size'
      • 'border-image-source'
      • 'border-image-slice'
      • 'border-image-width'
        • @@ -119033,24 +119024,6 @@ input[type=image i][align=bottom i], object[align=bottom i] {
      • 'border-end-end-radius'
      -

      The relevant any-value background properties are:

      - -
        -
      • 'background-color'
        • -
      - -

      The relevant non-initial value background properties are:

      - -
        -
      • 'background-image'
        • -
      • 'background-repeat'
        • -
      • 'background-attachment'
        • -
      • 'background-position'
        • -
      • 'background-clip'
        • -
      • 'background-origin'
        • -
      • 'background-size'
        • -
      - From e1c8690071d2917157c8e5c98934ca59dc42232a Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Tue, 2 Jun 2020 15:57:44 +0200 Subject: [PATCH 08/38] Remove the check for authorProps matching the initial value; special-case 'revert' --- source | 23 +++++------------------ 1 file changed, 5 insertions(+), 18 deletions(-) diff --git a/source b/source index d9bfa2e34bd..6b776a5290a 100644 --- a/source +++ b/source @@ -118948,20 +118948,12 @@ input[type=image i][align=bottom i], object[align=bottom i] {
      1. -

        For each prop of the relevant any-value properties:

        +

        For each prop of the properties that disable native appearance for + widgets:

          -

        1. If authorProps[prop] exists, then return - fallback.

          2. -
        -
        2. - -
      2. -

        For each prop of the relevant non-initial value properties:

        - -
          -

        1. If authorProps[prop] exists and has a value that is not the - initial value for that property, then return fallback.

          2. +

        2. If authorProps[prop] exists, and it is not + "revert", then return fallback.

        3. @@ -118969,7 +118961,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
      -

      The relevant any-value properties are:

      +

      The properties that disable native appearance for widgets are:

      • 'background-color'
        • @@ -118997,11 +118989,6 @@ input[type=image i][align=bottom i], object[align=bottom i] {
      • 'border-block-end-width'
      • 'border-inline-start-width'
      • 'border-inline-end-width'
        • -
      - -

      The relevant non-initial value properties are:

      - -
      • 'background-image'
      • 'background-repeat'
      • 'background-attachment'
        • From f7d301670b0072bb541ffcf463e679c28d21e17d Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Tue, 2 Jun 2020 16:35:17 +0200 Subject: [PATCH 09/38] Change button to not be applicable to non-buttons --- source | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/source b/source index 6b776a5290a..a4b20e6f552 100644 --- a/source +++ b/source @@ -118937,9 +118937,7 @@ input[type=image i][align=bottom i], object[align=bottom i] { -

      • If computedAppearance is 'button', then return button. Otherwise, return none.

        • +

      • Return none.

    The appropriate widget, given a map of properties From 6b92111ea3314b5c54d09bb4548c15f697b4fc09 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Thu, 4 Jun 2020 12:18:56 +0200 Subject: [PATCH 10/38] Remove background-appearance from 'properties that disable native appearance for widgets' --- source | 1 - 1 file changed, 1 deletion(-) diff --git a/source b/source index a4b20e6f552..2b2fcd6e601 100644 --- a/source +++ b/source @@ -118988,7 +118988,6 @@ input[type=image i][align=bottom i], object[align=bottom i] {

  • 'border-inline-start-width'
  • 'border-inline-end-width'
  • 'background-image'
    • -
  • 'background-repeat'
  • 'background-attachment'
  • 'background-position'
  • 'background-clip'
    • From 7d4867af81cf25791820e91bcd5053fadad2d52a Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Thu, 4 Jun 2020 12:29:11 +0200 Subject: [PATCH 11/38] Include Animation Origin and Transition Origins --- source | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/source b/source index 2b2fcd6e601..61b0b4b6f30 100644 --- a/source +++ b/source @@ -3856,6 +3856,10 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
  • used value
  • cascade origin
  • Author Origin
    • +
  • User Origin
    • +
  • User Agent Origin
    • +
  • Animation Origin
    • +
  • Transition Origin
  • initial value
    • @@ -118833,9 +118837,11 @@ input[type=image i][align=bottom i], object[align=bottom i] { element's 'appearance' property.

  • Let authorProps be a map of all properties - that have a cascaded value for element, where all cascade origins except the Author Origin are ignored, where the key - is the property name and the value is that cascaded value.

    • + that have a cascaded value for element, where the Author + Origin, Animation Origin and Transition Origin cascade origins are included and the User Origin and + User Agent Origin cascade origins are ignored, + where the key is the property name and the value is that cascaded value.

  • If namespace is the HTML namespace:

    From f7d04bea5060d2352d575db81e452069c7e0194c Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Thu, 4 Jun 2020 13:47:33 +0200 Subject: [PATCH 12/38] Remove reference to --- source | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/source b/source index 61b0b4b6f30..a5aa3230c14 100644 --- a/source +++ b/source @@ -3743,9 +3743,8 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
  • The 'outline' property
  • The 'cursor' property
  • The 'appearance' property and its - <compat-none> and <compat-auto> - non-terminal value types.
    • + non-terminal value type.
  • The 'pointer-events' property
  • The 'user-select' property
    • @@ -118822,8 +118821,8 @@ input[type=image i][align=bottom i], object[align=bottom i] {
      -

    1. If computedAppearance is 'none' or one of the <compat-none> - values, then return none.

      2. +

    2. If computedAppearance is 'none', then return + none.

    3. Let localName be element's local name.

      4. From 46b8fdc21b7e3b9722a1b9d922c387c026078095 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Thu, 4 Jun 2020 13:52:18 +0200 Subject: [PATCH 13/38] Remove appearance: button handling for --- source | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/source b/source index 238152f5296..42181ef5a9f 100644 --- a/source +++ b/source @@ -118907,7 +118907,7 @@ input[type=image i][align=bottom i], object[align=bottom i] { Range, then return slider-horizontal.

      - +

    4. If localName is "select":

      @@ -118917,11 +118917,6 @@ input[type=image i][align=bottom i], object[align=bottom i] {

    5. Assert: selectState is drop-down box.

      6. -

    6. If computedAppearance is 'button', then return the appropriate - widget with authorProps set to authorProps, expected - set to button, and fallback set to - none.

      7. -

    7. If computedAppearance is 'menulist-button', then return menulist-button.

      8. From 82ee82d63cac93967ed438ce646f32c952b0c8fa Mon Sep 17 00:00:00 2001 From: Howard Edwards Date: Wed, 25 Aug 2021 16:45:38 -0500 Subject: [PATCH 27/38] Updated section on computing the kind of widget --- source | 138 +++++++++++++++------------------------------------------ 1 file changed, 35 insertions(+), 103 deletions(-) diff --git a/source b/source index 42181ef5a9f..61e2bfadd7f 100644 --- a/source +++ b/source @@ -3718,12 +3718,6 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
    8. The concept native appearance
      9. -

      The following features are defined in CSS User Interface:

      - -
        -
      • The concept native appearance
        • -
      -

      The following features are defined in CSS Writing Modes:

        @@ -118805,10 +118799,10 @@ input[type=image i][align=bottom i], object[align=bottom i] {
        -

        Which widget to use for an element

        +

        Determine what widget an HTML element can be

        -

        This section defines how to compute what kind of widget will be used for a given - element. The possible kinds of widgets are +

        This section defines how to determine what kind of widget an element is. + The possible kinds of widgets are none, button, searchfield, @@ -118823,7 +118817,7 @@ input[type=image i][align=bottom i], object[align=bottom i] { progress-bar, and meter.

        -

        To compute the kind of widget to use for an element element:

        +

        To determine the kind of widget to use for an element element:

          @@ -118872,7 +118866,10 @@ input[type=image i][align=bottom i], object[align=bottom i] {
        1. -

          If localName is "input" and either:

          +

          To determine if an HTML element can be a textfield, given + computedAppearance: localName is "input" + and:

          • inputState is one of Text, Week, Time, Local Date and Time, or Number
            • + data-x="attr-input-type-number">Number or,
          • inputState is Search and - computedAppearance is 'textfield'
            • + computedAppearance is 'textfield'.
          - -

          ...then return the appropriate widget with authorProps set to - authorProps, expected set to textfield, and fallback set to none.

          2. -

        2. If localName is "input" and inputState is - Search, then return the appropriate - widget with authorProps set to authorProps, expected - set to searchfield, and fallback - set to none.

          3. +

        3. To determine if an HTML element can be a searchfield, given + computedAppearance: localName is "input" and + inputState is Search.

          4. -

        4. If localName is "input" and inputState is - Range, then return slider-horizontal.

          5. +

        5. To determine if an HTML element can be a slider-horizontal, given + computedAppearance: localName is "input" and + inputState is Range.

          6. + + +

        6. To determine if an HTML element can be a checkbox, given + computedAppearance: localName is "input" and + inputState is Checkbox.

          7. + + +

        7. To determine if an HTML element can be a radio, given + computedAppearance: localName is "input" and + inputState is Radio.

        8. @@ -118919,19 +118923,15 @@ input[type=image i][align=bottom i], object[align=bottom i] {

        9. If computedAppearance is 'menulist-button', then return menulist-button.

          10. - -

        10. Return the appropriate widget with authorProps set to - authorProps, expected set to menulist, and fallback set to menulist-button.

        -

      • If localName is "textarea", then return the - appropriate widget with authorProps set to authorProps, - expected set to textarea, and - fallback set to none.

        • +
      • +

        To determine if an HTML element can be a textarea, given + computedAppearance: localName is "textarea".

        +

      • If localName is "progress", then return

        Return none.

    -

    The appropriate widget, given a map of properties - authorProps, and an expected kind of widget expected, and a - fallback kind of widget fallback, is as follows:

    - -
      -
    1. -

      For each prop of the properties that disable native appearance for - widgets:

      - -
        -

      1. If authorProps[prop] exists, and it is not - "revert", then return fallback.

        2. -
      -
      2. - -

    2. Return expected.

      3. -
    - - -

    The properties that disable native appearance for widgets are:

    - - - From 313817938e8113f49c516b953a87c7b26c2c06e6 Mon Sep 17 00:00:00 2001 From: Howard Edwards Date: Wed, 25 Aug 2021 17:13:57 -0500 Subject: [PATCH 28/38] after rebase fix --- source | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/source b/source index 61e2bfadd7f..bbc309a55e4 100644 --- a/source +++ b/source @@ -118088,6 +118088,7 @@ input, button { input, select, button, textarea { appearance: auto; } + input[type=hidden i], input[type=file i], input[type=image i] { appearance: none; } @@ -118854,15 +118855,14 @@ input[type=image i][align=bottom i], object[align=bottom i] { drop-down box otherwise.

    -

  • If localName is "button", or localName is - "input" and inputState is one of

    To determine if an HTML element can be a button, given computedAppearance: + localName is "button", or localName is + "input" and typeState is one of Button, Submit, Reset, or Color, then return the appropriate widget - with authorProps set to authorProps, expected set to button, and fallback set to none.

    • + data-x="attr-input-type-color">Color.

  • From b8c39a6b112f7626136ae1253877f0221cb2bb4c Mon Sep 17 00:00:00 2001 From: Howard Edwards Date: Wed, 25 Aug 2021 17:25:22 -0500 Subject: [PATCH 29/38] removed authorProps --- source | 9 +-------- 1 file changed, 1 insertion(+), 8 deletions(-) diff --git a/source b/source index bbc309a55e4..1df394905f1 100644 --- a/source +++ b/source @@ -118802,7 +118802,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {

    Determine what widget an HTML element can be

    -

    This section defines how to determine what kind of widget an element is. +

    This section defines how to determine what kind of widget an element can be. The possible kinds of widgets are none, button, @@ -118836,13 +118836,6 @@ input[type=image i][align=bottom i], object[align=bottom i] {

  • Let computedAppearance be the computed value of element's 'appearance' property.

    • -

  • Let authorProps be a map of all properties - that have a cascaded value for element, where the Author - Origin, Animation Origin and Transition Origin cascade origins are included and the User Origin and - User Agent Origin cascade origins are ignored, - where the key is the property name and the value is that cascaded value.

    • -

  • If namespace is the HTML namespace:

    From fb6c5c732450be6fe65d9fe10bc81f43cb56dd2e Mon Sep 17 00:00:00 2001 From: Howard Edwards Date: Tue, 31 Aug 2021 07:56:31 -0500 Subject: [PATCH 30/38] defined sections for 'can be widget' --- source | 319 +++++++++++++++++++++++++++++++++++++++++---------------- 1 file changed, 233 insertions(+), 86 deletions(-) diff --git a/source b/source index 1df394905f1..07d489b731d 100644 --- a/source +++ b/source @@ -118806,8 +118806,8 @@ input[type=image i][align=bottom i], object[align=bottom i] { The possible kinds of widgets are none, button, - searchfield, textfield, + searchfield, slider-horizontal, checkbox, radio, @@ -118840,99 +118840,26 @@ input[type=image i][align=bottom i], object[align=bottom i] {

    If namespace is the HTML namespace:

      -

    1. If localName is "input", then set inputState - to element's type attribute's state.

      2. - -

    2. If localName is "select", then set - selectState to list box if it is a list box, and - drop-down box otherwise.

      3. - - -

    3. To determine if an HTML element can be a button, given computedAppearance: - localName is "button", or localName is - "input" and typeState is one of Button, Submit, Reset, or Color.

      4. - - -
    4. -

      To determine if an HTML element can be a textfield, given - computedAppearance: localName is "input" - and:

      +

    5. Determine if an element can be a button.

      6. -
        -
      • inputState is one of Text, Telephone, URL, - E-mail, Password, Date, Month, - Week, Time, Local Date and Time, or Number or,
        • - -
      • inputState is Search and - computedAppearance is 'textfield'.
        • -
      - +

    6. Determine if an element can be a textfield.

      7. - -

    7. To determine if an HTML element can be a searchfield, given - computedAppearance: localName is "input" and - inputState is Search.

      8. - - -

    8. To determine if an HTML element can be a slider-horizontal, given - computedAppearance: localName is "input" and - inputState is Range.

      9. - - -

    9. To determine if an HTML element can be a checkbox, given - computedAppearance: localName is "input" and - inputState is Checkbox.

      10. - - -

    10. To determine if an HTML element can be a radio, given - computedAppearance: localName is "input" and - inputState is Radio.

      11. - - -
    11. -

      If localName is "select":

      +

    12. Determine if an element can be a searchfield.

      13. -
        -

      1. If selectState is list box, then return none.

        2. +

      2. Determine if an element can be a slider-horizontal.

        3. -

      3. Assert: selectState is drop-down box.

        4. +

      4. Determine if an element can be a checkbox.

        5. -

      5. If computedAppearance is 'menulist-button', then return menulist-button.

        6. -
      - +

    13. Determine if an element can be a radio.

      14. - -
    14. -

      To determine if an HTML element can be a textarea, given - computedAppearance: localName is "textarea".

      -
      15. +

    15. Determine if an element can be a listbox, can be a menulist or + can be a menulist-button.

      16. - -

    16. If localName is "progress", then return progress-bar.

      17. +

    17. Determine if an element can be a textarea.

      18. - -

    18. If localName is "meter", then return meter.

      19. +

    19. Determine if an element can be a progress-bar.

      20. + +

    20. Determine if an element can be a meter.

    • @@ -118940,6 +118867,226 @@ input[type=image i][align=bottom i], object[align=bottom i] {

  • Return none.

    • + +
    Determine if element can be a button
    + +

    An element element given computedAppearance + can be a button as follows:

    + +
      +

    1. Check if namespace is the HTML namespace:

      2. + +

    2. Check if localName is "input", then set + inputState to element's type + attribute's state.

      3. + +

    3. Given computedAppearance: localName is + "button", or localName is + "input" and typeState is one of Button, Submit, Reset, or Color.

      4. + +

    4. Return true.

      5. +
    + + +
    Determine if element can be a textfield
    + +

    An element element given computedAppearance + can be a textfield as follows:

    + +
      +

    1. Check if namespace is the HTML namespace:

      2. + +

    2. Check if localName is "input", then set + inputState to element's type + attribute's state.

      3. + +
    3. +

      Given computedAppearance: localName is + "input" and:

      + +
        +
      • inputState is one of Text, Telephone, URL, + E-mail, Password, Date, Month, + Week, Time, Local Date and Time, or Number or,
        • + +
      • inputState is Search and + computedAppearance is 'textfield'.
        • +
      +
      4. + +

    4. Return true.

      5. +
    + + +
    Determine if element can be a searchfield
    + +

    An element element given computedAppearance + can be a searchfield as follows:

    + +
      +

    1. Check if namespace is the HTML namespace:

      2. + +

    2. Check if localName is "input", then set + inputState to element's type + attribute's state.

      3. + +

    3. Given computedAppearance: localName is + "input" and inputState is Search.

      4. + +

    4. Return true.

      5. +
    + + +
    Determine if element can be a slider-horizontal
    + +

    An element element given computedAppearance + can be a slider-horizontal as follows:

    + +
      +

    1. Check if namespace is the HTML namespace:

      2. + +

    2. Check if localName is "input", then set + inputState to element's type + attribute's state.

      3. + +

    3. Given computedAppearance: localName is + "input" and inputState is Range.

      4. + +

    4. Return true.

      5. +
    + + +
    Determine if element can be a checkbox
    + +

    An element element given computedAppearance + can be a checkbox as follows:

    + +
      +

    1. Check if namespace is the HTML namespace:

      2. + +

    2. Check if localName is "input", then set + inputState to element's type + attribute's state.

      3. + +

    3. Given computedAppearance: localName is + "input" and inputState is Checkbox.

      4. + +

    4. Return true.

      5. +
    + + +
    Determine if element can be a radio
    + +

    An element element given computedAppearance + can be a radio as follows:

    + +
      +

    1. Check if namespace is the HTML namespace:

      2. + +

    2. Check if localName is "input", then set + inputState to element's type + attribute's state.

      3. + +

    3. Given computedAppearance: localName is + "input" and inputState is Radio.

      4. + +

    4. Return true.

      5. +
    + + +
    Determine if element can be a listbox, menulist, menulist-button
    + +

    An element element given computedAppearance + can be a listbox, can be a menulist or + can be a menulist-button as follows:

    + +
      +

    1. Check if namespace is the HTML namespace:

      2. + +
    2. +

      Check if localName is "select", then set + selectState to list box if it is a list box, and + drop-down box otherwise.

      + +
        +

      1. If selectState is list box, then return none.

        2. + +

      2. Assert: selectState is drop-down box.

        3. + +

      3. If computedAppearance is 'menulist-button', then return menulist-button.

        4. +
      +
      3. + +

    3. Return true.

      4. +
    + + +
    Determine if element can be a textarea
    + +

    An element element given computedAppearance + can be a textarea as follows:

    + +
      +

    1. Check if namespace is the HTML namespace:

      2. + +

    2. Check if localName is "textarea".

      3. + +

    3. Given computedAppearance: localName is + "textarea".

      4. + +

    4. Return true.

      5. +
    + + +
    Determine if element can be a progress-bar
    + +

    An element element given computedAppearance + can be a progress-bar as follows:

    + +
      +

    1. Check if namespace is the HTML namespace:

      2. + +

    2. Check if localName is "progress".

      3. + +

    3. Given computedAppearance: localName is + "progress".

      4. + +

    4. Return true.

      5. +
    + + +
    Determine if element can be a meter
    + +

    An element element given computedAppearance + can be a meter as follows:

    + +
      +

    1. Check if namespace is the HTML namespace:

      2. + +

    2. Check if localName is "meter".

      3. + +

    3. Given computedAppearance: localName is + "meter".

      4. + +

    4. Return true.

      5. +
    + From 29b64770a7c8b7757bc545c8d555cd7fdc6fb989 Mon Sep 17 00:00:00 2001 From: Howard Edwards Date: Tue, 31 Aug 2021 09:15:48 -0500 Subject: [PATCH 31/38] typeState to inputState typo fix --- source | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source b/source index 07d489b731d..faa788db6b8 100644 --- a/source +++ b/source @@ -118882,7 +118882,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {

  • Given computedAppearance: localName is "button", or localName is - "input" and typeState is one of input" and inputState is one of Button, Submit, Reset, or Date: Tue, 31 Aug 2021 09:25:07 -0500 Subject: [PATCH 32/38] formatting --- source | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/source b/source index faa788db6b8..557ba2d65a7 100644 --- a/source +++ b/source @@ -118880,7 +118880,7 @@ input[type=image i][align=bottom i], object[align=bottom i] { inputState to element's type attribute's state.

    • -

  • Given computedAppearance: localName is +

  • Given computedAppearance, localName is "button", or localName is "input" and inputState is one of Button,

  • -

    Given computedAppearance: localName is +

    Given computedAppearance, localName is "input" and:

      @@ -118940,7 +118940,7 @@ input[type=image i][align=bottom i], object[align=bottom i] { inputState to element's type attribute's state.

      -

    • Given computedAppearance: localName is +

    • Given computedAppearance, localName is "input" and inputState is Search.

      • @@ -118960,7 +118960,7 @@ input[type=image i][align=bottom i], object[align=bottom i] { inputState to element's type attribute's state.

      -

    • Given computedAppearance: localName is +

    • Given computedAppearance, localName is "input" and inputState is Range.

      • @@ -118980,7 +118980,7 @@ input[type=image i][align=bottom i], object[align=bottom i] { inputState to element's type attribute's state.

      -

    • Given computedAppearance: localName is +

    • Given computedAppearance, localName is "input" and inputState is Checkbox.

      • @@ -119000,7 +119000,7 @@ input[type=image i][align=bottom i], object[align=bottom i] { inputState to element's type attribute's state.

      -

    • Given computedAppearance: localName is +

    • Given computedAppearance, localName is "input" and inputState is Radio.

      • @@ -119047,7 +119047,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {

    • Check if localName is "textarea".

      • -

    • Given computedAppearance: localName is +

    • Given computedAppearance, localName is "textarea".

    • Return true.

      • @@ -119064,7 +119064,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {

    • Check if localName is "progress".

      • -

    • Given computedAppearance: localName is +

    • Given computedAppearance, localName is "progress".

    • Return true.

      • @@ -119081,7 +119081,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {

    • Check if localName is "meter".

      • -

    • Given computedAppearance: localName is +

    • Given computedAppearance, localName is "meter".

    • Return true.

      • From 6789563448d37b8a51584df9acd268626daae386 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Wed, 8 Sep 2021 17:11:26 +0200 Subject: [PATCH 33/38] Remove 'determine the kind of widget' since it's in CSS UI, and fix 'can be a button' --- source | 78 ++++++++++++++-------------------------------------------- 1 file changed, 19 insertions(+), 59 deletions(-) diff --git a/source b/source index 557ba2d65a7..2b8df79d7e0 100644 --- a/source +++ b/source @@ -118818,77 +118818,37 @@ input[type=image i][align=bottom i], object[align=bottom i] { progress-bar, and meter.

      -

      To determine the kind of widget to use for an element element:

      -
        - -

      1. If computedAppearance is 'none', then return - none.

        2. - -

      2. Let localName be element's local name.

        3. +
        Determine if element can be a button
        -

      3. Let namespace be element's namespace.

        4. +

        To determine if an element element can be a button, given + computedAppearance:

        -

      4. Let inputState be null.

        5. +
          +

        1. If element's namespace is not + the HTML namespace, then return false.

          2. -

        2. Let selectState be null.

          3. +

        3. Let localName be element's local name.

          4. -

        4. Let computedAppearance be the computed value of - element's 'appearance' property.

          5. +

        5. If localName is "button", then return true.

        6. -

          If namespace is the HTML namespace:

          +

          If localName is "input", then:

            -

          1. Determine if an element can be a button.

            2. - -

          2. Determine if an element can be a textfield.

            3. - -

          3. Determine if an element can be a searchfield.

            4. - -

          4. Determine if an element can be a slider-horizontal.

            5. - -

          5. Determine if an element can be a checkbox.

            6. - -

          6. Determine if an element can be a radio.

            7. - -

          7. Determine if an element can be a listbox, can be a menulist or - can be a menulist-button.

            8. - -

          8. Determine if an element can be a textarea.

            9. - -

          9. Determine if an element can be a progress-bar.

            10. - -

          10. Determine if an element can be a meter.

            11. +

          11. Let inputState be element's type attribute's state.

            12. + +

          12. If inputState is one of Button, Submit, Reset, or Color, then return true.

          7. - -

        7. Return none.

          8. -
        - - -
        Determine if element can be a button
        - -

        An element element given computedAppearance - can be a button as follows:

        - -
          -

        1. Check if namespace is the HTML namespace:

          2. - -

        2. Check if localName is "input", then set - inputState to element's type - attribute's state.

          3. - -

        3. Given computedAppearance, localName is - "button", or localName is - "input" and inputState is one of Button, Submit, Reset, or Color.

          4. - -

        4. Return true.

          5. +

        5. Return false.

        From 6eb5bf8744c098c50c17a240096fef886d2c206b Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Thu, 9 Sep 2021 14:46:19 +0200 Subject: [PATCH 34/38] Fix remaining 'can be a ...' algorithms --- source | 244 +++++++++++++++++++++++++++++++++------------------------ 1 file changed, 142 insertions(+), 102 deletions(-) diff --git a/source b/source index 2b8df79d7e0..074cd6dd626 100644 --- a/source +++ b/source @@ -118854,197 +118854,237 @@ input[type=image i][align=bottom i], object[align=bottom i] {
        Determine if element can be a textfield
        -

        An element element given computedAppearance - can be a textfield as follows:

        +

        To determine if an element element can be a textfield, given + computedAppearance:

          -

        1. Check if namespace is the HTML namespace:

          2. +

        2. If element's namespace is not + the HTML namespace, then return false.

          3. -

        3. Check if localName is "input", then set - inputState to element's type - attribute's state.

          4. +

        4. Let localName be element's local name.

        5. -

          Given computedAppearance, localName is - "input" and:

          +

          If localName is "input", then:

          -
            -
          • inputState is one of Text, Telephone, URL, - E-mail, Password, Date, Month, - Week, Time, Local Date and Time, or Number or,
            • - -
          • inputState is Search and - computedAppearance is 'textfield'.
            • -
          +
            +

          1. Let inputState be element's type attribute's state.

            2. + +
          2. +

            If one of the following are true, then return true:

            + +
              +
            • inputState is one of Text, Telephone, URL, + E-mail, Password, Date, Month, + Week, Time, Local Date and Time, or Number or,
              • + +
            • inputState is Search and + computedAppearance is 'textfield'.
              • +
            +
            3. +
          6. -

        6. Return true.

          7. +

        7. Return false.

        Determine if element can be a searchfield
        -

        An element element given computedAppearance - can be a searchfield as follows:

        +

        To determine if an element element can be a searchfield, given + computedAppearance:

          -

        1. Check if namespace is the HTML namespace:

          2. +

        2. If element's namespace is not + the HTML namespace, then return false.

          3. -

        3. Check if localName is "input", then set - inputState to element's type - attribute's state.

          4. +

        4. Let localName be element's local name.

          5. -

        5. Given computedAppearance, localName is - "input" and inputState is Search.

          6. +

        6. If localName is "input" and element's type attribute's state is Search, then return true.

          7. -

        7. Return true.

          8. +

        8. Return false.

        Determine if element can be a slider-horizontal
        -

        An element element given computedAppearance - can be a slider-horizontal as follows:

        +

        To determine if an element element can be a slider-horizontal, given + computedAppearance:

          -

        1. Check if namespace is the HTML namespace:

          2. +

        2. If element's namespace is not + the HTML namespace, then return false.

          3. -

        3. Check if localName is "input", then set - inputState to element's type - attribute's state.

          4. +

        4. Let localName be element's local name.

          5. -

        5. Given computedAppearance, localName is - "input" and inputState is Range.

          6. +

        6. If localName is "input" and element's type attribute's state is Range, then return true.

          7. -

        7. Return true.

          8. +

        8. Return false.

        Determine if element can be a checkbox
        -

        An element element given computedAppearance - can be a checkbox as follows:

        +

        To determine if an element element can be a checkbox, given + computedAppearance:

          -

        1. Check if namespace is the HTML namespace:

          2. +

        2. If element's namespace is not + the HTML namespace, then return false.

          3. -

        3. Check if localName is "input", then set - inputState to element's type - attribute's state.

          4. +

        4. Let localName be element's local name.

          5. -

        5. Given computedAppearance, localName is - "input" and inputState is Checkbox.

          6. +

        6. If localName is "input" and element's type attribute's state is Checkbox, then return true.

          7. -

        7. Return true.

          8. +

        8. Return false.

        Determine if element can be a radio
        -

        An element element given computedAppearance - can be a radio as follows:

        +

        To determine if an element element can be a radio, given + computedAppearance:

          -

        1. Check if namespace is the HTML namespace:

          2. +

        2. If element's namespace is not + the HTML namespace, then return false.

          3. -

        3. Check if localName is "input", then set - inputState to element's type - attribute's state.

          4. +

        4. Let localName be element's local name.

          5. -

        5. Given computedAppearance, localName is - "input" and inputState is Radio.

          6. +

        6. If localName is "input" and element's type attribute's state is Radio, then return true.

          7. -

        7. Return true.

          8. +

        8. Return false.

        -
        Determine if element can be a listbox, menulist, menulist-button
        +
        Determine if element can be a listbox
        -

        An element element given computedAppearance - can be a listbox, can be a menulist or - can be a menulist-button as follows:

        +

        To determine if an element element can be a listbox, given + computedAppearance:

          -

        1. Check if namespace is the HTML namespace:

          2. +

        2. If element's namespace is not + the HTML namespace, then return false.

          3. -
        3. -

          Check if localName is "select", then set - selectState to list box if it is a list box, and - drop-down box otherwise.

          +

        4. Let localName be element's local name.

          5. -
            -

          1. If selectState is list box, then return none.

            2. +

          2. If localName is "select" and element is a + list box, then return true.

            3. -

          3. Assert: selectState is drop-down box.

            4. +

          4. Return false.

            5. +
          -

        5. If computedAppearance is 'menulist-button', then return menulist-button.

          6. -
        - -

      5. Return true.

        6. +
        Determine if element can be a menulist
        + +

        To determine if an element element can be a menulist, given + computedAppearance:

        + +
          +

        1. If element's namespace is not + the HTML namespace, then return false.

          2. + +

        2. Let localName be element's local name.

          3. + +

        3. If localName is "select" and element is a + drop-down box, then return true.

          4. + +

        4. Return false.

          5. +
        + + +
        Determine if element can be a menulist-button
        + +

        To determine if an element element can be a menulist-button, given + computedAppearance:

        + +
          +

        1. If element's namespace is not + the HTML namespace, then return false.

          2. + +

        2. Let localName be element's local name.

          3. + +

        3. If localName is "select", element is a + drop-down box, and computedAppearance is 'menulist-button', then return + true.

          4. + +

        4. Return false.

        Determine if element can be a textarea
        -

        An element element given computedAppearance - can be a textarea as follows:

        +

        To determine if an element element can be a textarea, given + computedAppearance:

          -

        1. Check if namespace is the HTML namespace:

          2. +

        2. If element's namespace is not + the HTML namespace, then return false.

          3. -

        3. Check if localName is "textarea".

          4. +

        4. Let localName be element's local name.

          5. -

        5. Given computedAppearance, localName is - "textarea".

          6. +

        6. If localName is "textarea", then return true.

          7. -

        7. Return true.

          8. +

        8. Return false.

        Determine if element can be a progress-bar
        -

        An element element given computedAppearance - can be a progress-bar as follows:

        +

        To determine if an element element can be a progress-bar, given + computedAppearance:

          -

        1. Check if namespace is the HTML namespace:

          2. +

        2. If element's namespace is not + the HTML namespace, then return false.

          3. -

        3. Check if localName is "progress".

          4. +

        4. Let localName be element's local name.

          5. -

        5. Given computedAppearance, localName is - "progress".

          6. +

        6. If localName is "progress", then return true.

          7. -

        7. Return true.

          8. +

        8. Return false.

        Determine if element can be a meter
        -

        An element element given computedAppearance - can be a meter as follows:

        +

        To determine if an element element can be a meter, given + computedAppearance:

          -

        1. Check if namespace is the HTML namespace:

          2. +

        2. If element's namespace is not + the HTML namespace, then return false.

          3. -

        3. Check if localName is "meter".

          4. +

        4. Let localName be element's local name.

          5. -

        5. Given computedAppearance, localName is - "meter".

          6. +

        6. If localName is "meter", then return true.

          7. -

        7. Return true.

          8. +

        8. Return false.

        From 12f662207d4a16bad79cb0a29e52d3ca558eaf17 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Thu, 9 Sep 2021 17:09:23 +0200 Subject: [PATCH 35/38] Correctly reference CSS UI for various terms --- source | 79 ++++++++++++++++++++++++++++++++++------------------------ 1 file changed, 46 insertions(+), 33 deletions(-) diff --git a/source b/source index 074cd6dd626..ee1594b4471 100644 --- a/source +++ b/source @@ -3712,12 +3712,6 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
      6. The 'word-spacing' property
    -

    The following features are defined in CSS User Interface:

    - -
      -
    • The concept native appearance
      • -
    -

    The following features are defined in CSS Writing Modes:

      @@ -3745,6 +3739,34 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
    • The 'appearance' property and its <compat-auto> non-terminal value type.
      • +
    • The concept native appearance
      • +
    • The concept kind of widget + and associated kinds of widgets + none, + button, + searchfield, + textfield, + slider-horizontal, + checkbox, + radio, + listbox, + menulist, + menulist-button, + textarea, + progress-bar, + meter.
      • +
    • The can be a button, + can be a textfield, + can be a searchfield, + can be a slider-horizontal, + can be a checkbox, + can be a radio, + can be a listbox, + can be a menulist, + can be a menulist-button, + can be a textarea, + can be a progress-bar, + can be a meter concepts.
    • The 'pointer-events' property
    • The 'user-select' property
    @@ -118802,26 +118824,17 @@ input[type=image i][align=bottom i], object[align=bottom i] {

    Determine what widget an HTML element can be

    -

    This section defines how to determine what kind of widget an element can be. - The possible kinds of widgets are - none, - button, - textfield, - searchfield, - slider-horizontal, - checkbox, - radio, - listbox, - menulist, - menulist-button, - textarea, - progress-bar, and - meter.

    +

    The CSS Basic User Interface specification defines how to determine what + kind of widget an element can be. This section defines which elements can be a + button, can be a textfield, can be a searchfield, can be a + slider-horizontal, can be a menulist-button, can be a menulist, + can be a textarea, can be a progress-bar, can be a meter. +

    Determine if element can be a button
    -

    To determine if an element element can be a button, given +

    To determine if an element element can be a button, given computedAppearance:

      @@ -118854,7 +118867,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
      Determine if element can be a textfield
      -

      To determine if an element element can be a textfield, given +

      To determine if an element element can be a textfield, given computedAppearance:

        @@ -118898,7 +118911,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
        Determine if element can be a searchfield
        -

        To determine if an element element can be a searchfield, given +

        To determine if an element element can be a searchfield, given computedAppearance:

          @@ -118918,7 +118931,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
          Determine if element can be a slider-horizontal
          -

          To determine if an element element can be a slider-horizontal, given +

          To determine if an element element can be a slider-horizontal, given computedAppearance:

            @@ -118938,7 +118951,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
            Determine if element can be a checkbox
            -

            To determine if an element element can be a checkbox, given +

            To determine if an element element can be a checkbox, given computedAppearance:

              @@ -118958,7 +118971,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
              Determine if element can be a radio
              -

              To determine if an element element can be a radio, given +

              To determine if an element element can be a radio, given computedAppearance:

                @@ -118978,7 +118991,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
                Determine if element can be a listbox
                -

                To determine if an element element can be a listbox, given +

                To determine if an element element can be a listbox, given computedAppearance:

                  @@ -118997,7 +119010,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
                  Determine if element can be a menulist
                  -

                  To determine if an element element can be a menulist, given +

                  To determine if an element element can be a menulist, given computedAppearance:

                    @@ -119016,7 +119029,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
                    Determine if element can be a menulist-button
                    -

                    To determine if an element element can be a menulist-button, given +

                    To determine if an element element can be a menulist-button, given computedAppearance:

                      @@ -119036,7 +119049,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
                      Determine if element can be a textarea
                      -

                      To determine if an element element can be a textarea, given +

                      To determine if an element element can be a textarea, given computedAppearance:

                        @@ -119054,7 +119067,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
                        Determine if element can be a progress-bar
                        -

                        To determine if an element element can be a progress-bar, given +

                        To determine if an element element can be a progress-bar, given computedAppearance:

                          @@ -119072,7 +119085,7 @@ input[type=image i][align=bottom i], object[align=bottom i] {
                          Determine if element can be a meter
                          -

                          To determine if an element element can be a meter, given +

                          To determine if an element element can be a meter, given computedAppearance:

                            From 2fafcc2f49400d9eff9a431460203ab1f041aac5 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Fri, 10 Sep 2021 09:56:04 +0200 Subject: [PATCH 36/38] Address review comments --- source | 145 +++++++-------------------------------------------------- 1 file changed, 17 insertions(+), 128 deletions(-) diff --git a/source b/source index ee1594b4471..66ed848cddf 100644 --- a/source +++ b/source @@ -118825,29 +118825,17 @@ input[type=image i][align=bottom i], object[align=bottom i] {

                            Determine what widget an HTML element can be

                            The CSS Basic User Interface specification defines how to determine what - kind of widget an element can be. This section defines which elements can be a - button, can be a textfield, can be a searchfield, can be a - slider-horizontal, can be a menulist-button, can be a menulist, - can be a textarea, can be a progress-bar, can be a meter. -

                            - - -
                            Determine if element can be a button
                            + kind of widget an element can be. This section defines which elements match these + concepts for HTML.

                            To determine if an element element can be a button, given computedAppearance:

                              -

                            1. If element's namespace is not - the HTML namespace, then return false.

                              2. - -

                            2. Let localName be element's local name.

                              3. - -

                            3. If localName is "button", then return true.

                              4. +

                            4. If element is a button element, then return true.

                            5. -

                              If localName is "input", then:

                              +

                              If element is an input element, then:

                              1. Let inputState be element's

                                Return false.

                              - -
                              Determine if element can be a textfield
                              -

                              To determine if an element element can be a textfield, given computedAppearance:

                                -

                              1. If element's namespace is not - the HTML namespace, then return false.

                                2. - -

                              2. Let localName be element's local name.

                                3. -
                              3. -

                                If localName is "input", then:

                                +

                                If element is an input element, then:

                                1. Let inputState be element's type attribute's state.

                                2. -

                                  If one of the following are true, then return true:

                                  +

                                  If either of the following are true, then return true:

                                  • inputState is one of Text, Week, Time, Local Date and Time, or Number or,
                                    • + data-x="attr-input-type-number">Number; or
                                  • inputState is Search and computedAppearance is 'textfield'.
                                    • @@ -118908,194 +118887,104 @@ input[type=image i][align=bottom i], object[align=bottom i] {

                                  • Return false.

                                - -
                                Determine if element can be a searchfield
                                -

                                To determine if an element element can be a searchfield, given computedAppearance:

                                  -

                                1. If element's namespace is not - the HTML namespace, then return false.

                                  2. - -

                                2. Let localName be element's local name.

                                  3. - -

                                3. If localName is "input" and element's

                                  If element is an input element and element's type attribute's state is Search, then return true.

                                4. Return false.

                                - -
                                Determine if element can be a slider-horizontal
                                -

                                To determine if an element element can be a slider-horizontal, given computedAppearance:

                                  -

                                1. If element's namespace is not - the HTML namespace, then return false.

                                  2. - -

                                2. Let localName be element's local name.

                                  3. - -

                                3. If localName is "input" and element's

                                  If element is an input element and element's type attribute's state is Range, then return true.

                                4. Return false.

                                - -
                                Determine if element can be a checkbox
                                -

                                To determine if an element element can be a checkbox, given computedAppearance:

                                  -

                                1. If element's namespace is not - the HTML namespace, then return false.

                                  2. - -

                                2. Let localName be element's local name.

                                  3. - -

                                3. If localName is "input" and element's

                                  If element is an input element and element's type attribute's state is Checkbox, then return true.

                                4. Return false.

                                - -
                                Determine if element can be a radio
                                -

                                To determine if an element element can be a radio, given computedAppearance:

                                  -

                                1. If element's namespace is not - the HTML namespace, then return false.

                                  2. - -

                                2. Let localName be element's local name.

                                  3. - -

                                3. If localName is "input" and element's

                                  If element is an input element and element's type attribute's state is Radio, then return true.

                                4. Return false.

                                - -
                                Determine if element can be a listbox
                                -

                                To determine if an element element can be a listbox, given computedAppearance:

                                  -

                                1. If element's namespace is not - the HTML namespace, then return false.

                                  2. - -

                                2. Let localName be element's local name.

                                  3. - -

                                3. If localName is "select" and element is a +

                                4. If element is a select element and element is a list box, then return true.

                                5. Return false.

                                - -
                                Determine if element can be a menulist
                                -

                                To determine if an element element can be a menulist, given computedAppearance:

                                  -

                                1. If element's namespace is not - the HTML namespace, then return false.

                                  2. - -

                                2. Let localName be element's local name.

                                  3. - -

                                3. If localName is "select" and element is a +

                                4. If element is a select element and element is a drop-down box, then return true.

                                5. Return false.

                                - -
                                Determine if element can be a menulist-button
                                -

                                To determine if an element element can be a menulist-button, given computedAppearance:

                                  -

                                1. If element's namespace is not - the HTML namespace, then return false.

                                  2. - -

                                2. Let localName be element's local name.

                                  3. - -

                                3. If localName is "select", element is a +

                                4. If element is a select element, element is a drop-down box, and computedAppearance is 'menulist-button', then return true.

                                5. Return false.

                                - -
                                Determine if element can be a textarea
                                -

                                To determine if an element element can be a textarea, given computedAppearance:

                                  -

                                1. If element's namespace is not - the HTML namespace, then return false.

                                  2. - -

                                2. Let localName be element's local name.

                                  3. - -

                                3. If localName is "textarea", then return true.

                                  4. +

                                4. If element is a textarea element, then return true.

                                5. Return false.

                                - -
                                Determine if element can be a progress-bar
                                -

                                To determine if an element element can be a progress-bar, given computedAppearance:

                                  -

                                1. If element's namespace is not - the HTML namespace, then return false.

                                  2. - -

                                2. Let localName be element's local name.

                                  3. - -

                                3. If localName is "progress", then return true.

                                  4. +

                                4. If element is a progress element, then return true.

                                5. Return false.

                                - -
                                Determine if element can be a meter
                                -

                                To determine if an element element can be a meter, given computedAppearance:

                                  -

                                1. If element's namespace is not - the HTML namespace, then return false.

                                  2. - -

                                2. Let localName be element's local name.

                                  3. - -

                                3. If localName is "meter", then return true.

                                  4. +

                                4. If element is a meter element, then return true.

                                5. Return false.

                                From 9fe616d2b40643356355408e2a6e3e7a80974066 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Fri, 10 Sep 2021 10:01:19 +0200 Subject: [PATCH 37/38] Make textfield/searchfield and menulist/menulist-button mutually exclusive for clarity --- source | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/source b/source index 66ed848cddf..bef786ea67d 100644 --- a/source +++ b/source @@ -118891,9 +118891,10 @@ input[type=image i][align=bottom i], object[align=bottom i] { computedAppearance:

                                  -

                                1. If element is an input element and element's

                                  If element is an input element, element's type attribute's state is Search, then return true.

                                  2. + data-x="attr-input-type-search">Search, and computedAppearance is not + 'textfield', then return true.

                                2. Return false.

                                @@ -118945,8 +118946,9 @@ input[type=image i][align=bottom i], object[align=bottom i] { computedAppearance:

                                  -

                                1. If element is a select element and element is a - drop-down box, then return true.

                                  2. +

                                2. If element is a select element, element is a + drop-down box, and computedAppearance is not 'menulist-button', then + return true.

                                3. Return false.

                                From 888593ea218a5bc5ce3d48efab17e4c28442a9ea Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Thu, 31 Mar 2022 11:33:36 +0200 Subject: [PATCH 38/38] Merge two style rules into one --- source | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/source b/source index bef786ea67d..7e420916488 100644 --- a/source +++ b/source @@ -118093,6 +118093,7 @@ input, select, button, textarea { text-transform: initial; text-indent: initial; text-shadow: initial; + appearance: auto; } input, select, textarea { @@ -118107,10 +118108,6 @@ input, button { display: inline-block; } -input, select, button, textarea { - appearance: auto; -} - input[type=hidden i], input[type=file i], input[type=image i] { appearance: none; }