They are substituting a combination of:

• JavaScript
• CSS
• ARIA

… in order to make a div which acts like a button.

This isn’t generally recommended as it requires a lot of work in order to ensure that the behaviour is consistent with how real buttons work across a variety of clients (including those which make use of screen readers or braille displays).

It is not necessary to use button for clicking and submitting forms. You can attach event listeners to any node in the DOM using JS and design div like a button. That’s why div is behaving like a button because they have registered onclick event on a div instead of putting a button there.

I recently tried to use selenium for learning. When I inspected the Twitter button, I find a div instead of a button.

Why Twitter div is behaving like a button?

Here is the tweet button code.

<div dir="auto" class="css-901oao r-1awozwy r-jwli3a r-6koalj r-18u37iz r-16y2uox r-1qd0xha r-a023e6 r-b88u0q r-1777fci r-eljoum r-dnmrzs r-bcqeeo r-q4m81j r-qvutc0"><span class="css-901oao css-16my406 css-bfa6kz r-1qd0xha r-ad9z0x r-bcqeeo r-qvutc0"><span class="css-901oao css-16my406 r-1qd0xha r-ad9z0x r-bcqeeo r-qvutc0">Tweet</span></span></div>

Is it because Twitter is using react(jsx) that why div are behaving like button.