Brave-browser: Checkboxes Disappear/Flicker on and Off

[andrewcking]

Description

So here is an odd issue, form checkboxes flicker in and out of visibility on Mac. I tested this on Windows and no such issue occurs.

Steps to Reproduce

1. Visit a site with a checkbox on Mac. For example:
   https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_input_type_checkbox
   https://getbootstrap.com/docs/4.0/components/forms/#checkboxes-and-radios

2. Click on the Checkbox

3. Watch the box(es) go in and out of visibility

Actual result:

This is a video recorded on the w3 page listed above going over checkboxes.
https://streamable.com/dfry4

Expected result:

Checkboxes should not flicker in and out of visibility

Reproduces how often:

100% of the time

Brave version (chrome://version info)

Brave | 0.55.3 Chromium: 70.0.3538.12 (Official Build) dev (64-bit)
Revision | ad61584ca32115f953ce656dd75b44f1c502a75d-refs/branch-heads/3538@{#179}

Reproducible on current release:

This does not occur on the laptop version of brave

Website problems only:

This does not occur on chromium. It occurs in Brave with no extensions installed and with brave shield off.

[kevinschaich]

Seeing this as well on the same version of Brave Dev on Mac as @andrewcking. Not just on one website, on multiple websites, and happens with Shields both on and off.

I recorded a quick GIF of the behavior:

[kevinschaich]

This is actually happening not just for checkboxes but also radio buttons:

[cndouglas]

Which version of macOS is this? Reminds me of brave/browser-laptop#14348 (problem with macOS 10.14 Mojave).

[kevinschaich]

I’m able to reproduce on both my work laptop (High Sierra) and my personal laptop (Mojave public beta).

[andrewcking]

55.5 fixed this for me (Mac - High Sierra)
Edit - No still broken but seems to be intermittent

[kevinschaich]

Thanks for the suggestion @andrewcking. Glad that fixed it for you. Unfortunately for me it's still broken on 0.55.5:

If anyone is having trouble reproducing, I see it pretty reliably on StickerMule's site (although this is not the _only_ site where it manifests).

Also note that I tried clearing all browser data from Brave as well as a (relatively nuclear) manual option:

sudo find ~/Library -iname '*brave*' -delete

Let me know if there's stuff outside of ~/Library I should try as well.

[andrewcking]

I played around with it again and I was able to get some radio buttons to disappear on me - so my earlier statement may have just been one of poor timing. Yep, still broken.

[kevinschaich]

OK, I think I may have narrowed the issue down to something possibly useful. Turing Hardware acceleration off fixes the problem for me:

Found this after some digging on Google / StackOverflow. @andrewcking – want to give this a try and see if it works for you as well?

Possibly related to #1151 I also recently filed.

[Brave-Matt]

• 1 from Community:
  https://community.brave.com/t/checkbox-flickering-issue/33228

[bsclifton]

A similar issue was reported on browser-laptop with https://github.com/brave/browser-laptop/issues/14348

User @hansemannn shared an extension they made which works around the issue:

• extension: https://chrome.google.com/webstore/detail/mojave-checkbox-fix/ihlgehdlkphgngjfagonbeoepadbdaae
• source: https://github.com/hansemannn/chrome-mojave-checkbox-extension

It's interesting to see the fix was to change the zoom level for the page. I reproduced the problem using brave-core on my mac and verified that increasing the zoom level does cause the checkbox / option boxes to render properly. Hopefully this provides a hint to where the problem is 😄

[notDavid]

and verified that increasing the zoom level does cause the checkbox / option boxes to render properly

fyi, what i always do when this problem occurs is quickly hit CMD + Tab twice (switch to another window and back), which also fixes it

[cndouglas]

@bsclifton Do you have hardware acceleration on? https://github.com/brave/brave-browser/issues/1160#issuecomment-423028344 says turning it off fixed the issue.

[jiripospisil]

I can reproduce as well. Disabling hardware acceleration fixes the issue.

https://streamable.com/zjlha
macOS High Sierra 10.13.6
Version 0.55.10 Chromium: 70.0.3538.22 (Official Build) beta (64-bit)

[srirambv]

+1 from @sundarms via #1355 for radio buttons not being rendered

[LaurenWags]

Verified passed with macOS 10.12.6 x64

Brave | 0.55.12 Chromium: 70.0.3538.45 (Official Build) beta(64-bit)
-- | --
Revision | cbdc32e4334458954e9def214d7e5fa1ca1960eb-refs/branch-heads/3538@{#830}
OS | Mac OS X

• Verified with STR from above description
  cc @kjozwiak to give this a try on his macOS version

Went through verification using the following build under macOS 10.13.6 x64 - PASSED

Brave | 0.55.12 Chromium: 70.0.3538.45 (Official Build) beta(64-bit)
-- | --
Revision | cbdc32e4334458954e9def214d7e5fa1ca1960eb-refs/branch-heads/3538@{#830}
OS | Mac OS X

• Verified with STR from above description