Mouse cursor briefly becomes "not allowed" sign when clicking on SE action buttons

Question

I don't know whether this just started or perhaps it's actually something new in my browser, but it must come down to SE code ultimately and I've never noticed it before today/yesterday.

Submit a comment via the "Add Comment" button, or submit a close-vote, or post a question, or do anything really that involves clicking one of those kinds of buttons, in Chrome 48 on Windows 7 64-bit, and you'll see your mouse cursor very briefly turn into the "not allowed" cursor right before the button is removed.

• Demonstration as GIFV

It seems the button is being disabled or whatnot before it's being hidden, which results in this "flash of malstyled content". Not a big deal but a little annoying.

Answer 1

The thought here was that changing the cursor to not-allowed helps visually reinforce that the button cannot be used right now. Frameworks such as Bootstrap and Foundation both use cursor: not-allowed; for their buttons.

I did some further research to see if these frameworks did this to be standards-compliant, yet I couldn't find anything that suggested the one should change the cursor to not-allowed for buttons.

If the goal here is to visually reinforce that the button isn't active, we can do this by changing the cursor back to default and drastically changing the button colors. After discussing it as a team, this is the route we thought best, so the button code has been updated to not change the cursor to not-allowed for :disabled button states.

This change is now live on production.

Answer 2

I thought it may have been Chrome introducing a new default cursor for disabled input type="button"s, but it's definitely in the SE all.css:

input[type=button].btn-confirm._disabled {
    box-shadow: none !important;
    cursor: not-allowed !important;
    color: #fff;
    background: #bbd1d8;
    border-color: #aac6cf
}

I understand the use of the cursor, in principle, but perhaps there's a way to prevent the flicker. A 0.5s delay after clicking the button before adding to it the class _disabled, perhaps?

Alternatively you could keep it simple and just remove the cursor icon override altogether. Does it really serve a purpose? Disabling a button is the conventional and accepted way to indicate that it can't be clicked; throwing up a red "do not click!" on top of that almost seems a tad bossy.