-
Notifications
You must be signed in to change notification settings - Fork 4
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add initial type="" API draft #49
Conversation
similar to the distinctions between e.g. `<ol>` / `<ul>` / `<menu>` or `<strong>` / `<em>` / `<small>`. | ||
- Like other semantic distinctions, | ||
authors may want to style based on the distinction. | ||
The [default styles](#default-styles) only change the border color of the toast, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I like this for the time being, but we definitely want to remember to bring this up in other toast default style conversations (this is a lot subtler than most other toast libraries' type styles)
The [default styles](#default-styles) only change the border color of the toast, | ||
but can be overridden by a page or design system to give any desired appearance. | ||
- The default type is `"info"`. | ||
- By default, `"error"` toasts will be treated as having the ARIA role semantics of [alert](https://rawgit.com/w3c/aria/master/#alert), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I feel like "warning"
toasts should also have the alert role (assuming we're adding aria roles) but that's a personal preference, either could work
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Let's leave this pending discussion in #18. I'm inclined to start conservatively.
@@ -209,6 +221,9 @@ const toast = document.createElement('std-toast'); | |||
console.log(toast.open); // false | |||
``` | |||
|
|||
The `type` enumerated attribute is reflected [limited to only known values](https://html.spec.whatwg.org/multipage/common-dom-interfaces.html#limited-to-only-known-values), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
In the text this shows up looking like "the type
enumerated attribute is reflected limited to only known values", there should probably be parens around the limited to only known values
portion.
README.md
Outdated
- TODO([#18](https://github.com/jackbsteinberg/std-toast/issues/18)): decide on list of WAI-ARIA Roles to use, and decide on types to natively support, create, and style. | ||
- `type`: an [enumerated attribute](https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#enumerated-attribute) giving the type of toast: | ||
one of `"info"`, `"success"`, `"warning"`, or `"error"`. | ||
This is used to convey the [semantics](https://html.spec.whatwg.org/multipage/dom.html#represents) of the toast, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thought: should the types be announced differently to screen readers?
For instance with this toast:
<std-toast type="error" open>
Access Denied!
</std-toast>
Should the screen reader read out something like error: Access Denied!
? Or is this encompassed by the toasts' aria roles?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
My general understanding is that screen-reader users should not get content tailored only for them in this way, but I have to run for tonight and want to do more reading before making a definitive statement in that regard.
One issue that came through when exploring the implementation of this API update is that, without an easy way to fallback to a The explicit types would could be styled using |
That makes sense. In particular, having |
This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e
This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e
This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e
This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708313 Commit-Queue: Jack Steinberg <[email protected]> Reviewed-by: Fergal Daly <[email protected]> Cr-Commit-Position: refs/heads/master@{#680073}
This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708313 Commit-Queue: Jack Steinberg <[email protected]> Reviewed-by: Fergal Daly <[email protected]> Cr-Commit-Position: refs/heads/master@{#680073}
This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708313 Commit-Queue: Jack Steinberg <[email protected]> Reviewed-by: Fergal Daly <[email protected]> Cr-Commit-Position: refs/heads/master@{#680073}
This is one take on the discussions in #18, that makes the existing text more concrete. The issue will remain open to discuss these details as well as alternatives.
…aults, for warning/error toasts
…L property and default styles, a=testonly Automatic update from web-platform-tests Add toast type attribute support with IDL property and default styles This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708313 Commit-Queue: Jack Steinberg <[email protected]> Reviewed-by: Fergal Daly <[email protected]> Cr-Commit-Position: refs/heads/master@{#680073} -- wpt-commits: 109a7d171d08bceb61dce865576de3c15f61c16c wpt-pr: 17923
…L property and default styles, a=testonly Automatic update from web-platform-tests Add toast type attribute support with IDL property and default styles This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708313 Commit-Queue: Jack Steinberg <[email protected]> Reviewed-by: Fergal Daly <[email protected]> Cr-Commit-Position: refs/heads/master@{#680073} -- wpt-commits: 109a7d171d08bceb61dce865576de3c15f61c16c wpt-pr: 17923
This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708313 Commit-Queue: Jack Steinberg <[email protected]> Reviewed-by: Fergal Daly <[email protected]> Cr-Commit-Position: refs/heads/master@{#680073}
…L property and default styles, a=testonly Automatic update from web-platform-tests Add toast type attribute support with IDL property and default styles This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708313 Commit-Queue: Jack Steinberg <jacksteinbergchromium.org> Reviewed-by: Fergal Daly <fergalchromium.org> Cr-Commit-Position: refs/heads/master{#680073} -- wpt-commits: 109a7d171d08bceb61dce865576de3c15f61c16c wpt-pr: 17923 UltraBlame original commit: 6b977ac34f96effce492d7b372f3cb8f9fe3b3b5
…L property and default styles, a=testonly Automatic update from web-platform-tests Add toast type attribute support with IDL property and default styles This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708313 Commit-Queue: Jack Steinberg <jacksteinbergchromium.org> Reviewed-by: Fergal Daly <fergalchromium.org> Cr-Commit-Position: refs/heads/master{#680073} -- wpt-commits: 109a7d171d08bceb61dce865576de3c15f61c16c wpt-pr: 17923 UltraBlame original commit: 6b977ac34f96effce492d7b372f3cb8f9fe3b3b5
…L property and default styles, a=testonly Automatic update from web-platform-tests Add toast type attribute support with IDL property and default styles This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708313 Commit-Queue: Jack Steinberg <jacksteinbergchromium.org> Reviewed-by: Fergal Daly <fergalchromium.org> Cr-Commit-Position: refs/heads/master{#680073} -- wpt-commits: 109a7d171d08bceb61dce865576de3c15f61c16c wpt-pr: 17923 UltraBlame original commit: 6b977ac34f96effce492d7b372f3cb8f9fe3b3b5
…L property and default styles, a=testonly Automatic update from web-platform-tests Add toast type attribute support with IDL property and default styles This change adds the toast type attribute and property according to the PR on the toast explainer here: jackbsteinberg/std-toast#49 There is still work TODO on implementing this PR, w.r.t the showToast type option, a11y behavior for warning / error, and default features for those types (Infinity duration, closebutton, etc) Additionally, a follow-up CL will come out to reconfigure the current reflection tests for type and open to use established reflection test methodology (ex: https://cs.chromium.org/chromium/src/third_party/blink/web_tests/wpt_internal/std-switch/tentative/form-associated-basic.js) Bug: 972945 Change-Id: I58c7079dc4f748928eea44103dece835e549986e Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708313 Commit-Queue: Jack Steinberg <[email protected]> Reviewed-by: Fergal Daly <[email protected]> Cr-Commit-Position: refs/heads/master@{#680073} -- wpt-commits: 109a7d171d08bceb61dce865576de3c15f61c16c wpt-pr: 17923
This is one take on the discussions in #18, that makes the existing text more concrete. The issue will remain open to discuss these details as well as alternatives.