Re: <toggle-button> Custom Element query

Hi everybody,

I guess, I have to apologise to all of you: I should#ve followed the links.

To Ashraf: you reference to the great article "Web Components and the Accessibility Object model (AOM)“ by Leonie. I myself quoted it several times, although it’s online for jus a short time yet.

She explains the AOM and how to use it. In this article Leonie explicitly shows how to use default semantics for custom elements. I think this is the way, it should be done, BUT:

The whole article is about something what is to come. It’s full of phrases like: "This feature has been proposed as a change to HTML, with an open pull request that has the details“ or „This part of the AOM is still being discussed and is not yet specified.“

So I think it is still not the time to build real world solutions the way Leonie proposes in this article. But maybe she sees your question and joins this thread…

Anyway: also take a look at the articles at https://inclusive-components.design/ - because Heydon uses established HTML features that do work in any browser...

Sorry once again for the confusion my earlier answers my have caused…

Marc


Am 20.02.2020 um 00:45 schrieb ashraf aleem <ashraf.aleem@gmail.com<mailto:ashraf.aleem@gmail.com>>:

Hi All,
         I am trying to use a Custom Element based on the 1st example in the following article by Leonie Watson:
https://www.24a11y.com/2019/web-components-and-the-aom/


Only difference being i want also change/toggle text too i.e. Play <-> Pause as the state changes

Please find the all 3 variants i intend to use it in:

https://codepen.io/ahnafcodes/pen/mdJrPOd

Please let me know let me know if I am violating any thing.

Note: This will not work in Safari or IE11. I plan to use a  https://github.com/WebReflection/heresy to make it work in Safari and make it simpler

Thanks
Ashraf Mohammad