I don’t see how to enter the two states at the bottom left (idle, down and hover, pressed). I can’t press without first hovering. Those two states seem to be inaccessible.
Click/hold the mouse while outside of the button. Middle-bottom state is hovering over the button while your mouse is down, without having clicked the button. I can see that being useful. However, I can't see why the bottom-left state is ever useful, except perhaps as the only way to get to the "hover, pressed" state.
It is useful because you don't want to fire when you click and hold outside the button, then enter the button area, then release. So, when you release inside the button, you must know whether you clicked inside or outside the button. Thus you need those states. I think.
If you imagine DOM elements as each having a separate FSM and if you consider the possibility of entry/exit actions on each state, "idle, down" in the bottom left could have an entry action that primes the system for drag & drop. Click down outside, release inside is exactly what D&D would have.
I am able to enter "idle, down" on chromium on linux by clicking and holding the very edge of the button.
Oh, how silly of me. I can enter that state by clicking anywhere outside the button (Vivaldi (basically Chrome) on Debian).