0

(See my marked answer to this question for my solution. The troubleshooting steps taken below led me to my solution, but do not solve the issue on their own.)

The Issue

When trying to use the editor on the Canva.com web app, it says While your browser seems to support WebGL, it is disabled on unavailable. How do I fix this?

System information

2023 M2 MacBook Air
macOS Ventura 13.4.1 (c)
Google Chrome version 117.0.5938.149
Generic HDMI plug-and-play monitor used in tandem with the MacBook Air display with an Anker USB-C to HDMI cable.

Troubleshooting Steps Taken and Additional Information

  1. Visited the website WebGL Report (github information here) and see an error showing This browser supports WebGL, but it is disabled or unavailable.
  2. I checked Chrome settings and confirm there is an update. I download and relaunch via Chrome settings page and check WebGL Report and Canva sites again, but see the same errors.
  3. I restart my computer, but still have the same errors when opening Chrome again. I checked the chrome://flags page, but do not see any flags that have been changed from their defaults.
  4. I open the chrome://gpu page and I see that a number of items under Graphics Feature Status show Software only, hardware acceleration unavailable, specifically Canvas, Compositing, Rasterization, Video Decode, Video Encode, WebGL, WebGL2, and WebGPU. Of note is a section called Problems Detected with the error Gpu compositing has been disabled, either via blocklist, about:flags or the command line. The browser will fall back to software compositing and hardware acceleration will be unavailable and Disabled Features: gpu_compositing.
  5. I again check chrome://flags, but do not see any changed items, nor does gpu_compositing show up in any of the flags.
  6. I disable my only two Chrome extensions via chrome://extensions, but have no changes to the errors. (Extension names omitted for privacy and security.)
  7. I unplug my external monitor and quit Chrome. I reopen chrome and continue to see the same errors above.
  8. I set the chrome://flag for #ignore-gpu-blocklist to enabled and restart Chrome with no change to the previous errors. I set this back to the default, which is the "disabled" setting.
  9. Of note, I did not try another browser to troubleshoot this issue.

1 Answer 1

0

Risk of Data Loss and Disclaimer

This solution can result in data loss if you are not properly prepared. Make sure you have your Chrome data properly backed up locally or synced to your Google Account. Your Chrome browser could include saved passwords, bookmarks, cookies, browsing history, and so on that could be lost if not properly backed up. Make sure your Google Account 2FA method is functioning properly. As much as I don't want you to lose your data, I cannot be held responsible for data loss.

If you are using a non-personal Google Workspaces account or if your Mac is managed by your work, check with your administrator before following these steps.

My Solution

It became clear that the easiest method to resolve this would be to remove Chrome + Chrome application support data and reinstalling. I took the following steps to solve this issue:

  1. Since we will be wiping Chrome from this Mac, you need to make sure your Google Chrome data is synced with Google or is backed up before continuing.
  2. Go to chrome.google.com and follow the prompts to download the Google Chrome installer. Continue after the download is complete.
  3. Quit Google Chrome from the menu bar - Google Chrome > Quit Google Chrome.
  4. Open a Finder window and navigate to your Applications folder. (Normally Chrome will be located at /Applications, but you can also navigate to your specific install by right clicking the Google Chrome icon on your Dock and selecting Options > Show in Finder.)
  5. Right click Google Chrome and select Move to Trash.
  6. Open a Finder window and open the "Go to" prompt by going to the menu bar and selecting Go > Go to folder... or press Command+Shift+G.
  7. In the Go to dialog box, enter ~/Library/Application Support/Google and press Return.
  8. In the Google folder, select the Chrome folder, copy it, and paste it to your desktop as a temporary backup.
  9. In the Google folder in Application Support, right click the Chrome folder and select Move to Trash. Do not empty the trash just yet.
  10. Open the downloaded Google Chrome disk image and install it by dragging the Google Chrome icon into the Applications folder. After the copy is completed, eject the disk image (right click the Google Chrome disk image on your Desktop and select Eject "Google Chrome".
  11. Go to your Applications folder and open Google Chrome. Note that it may take a few moments for Google Chrome to appear in Launchpad.
  12. Select Open on the macOS Gatekeeper prompt when it appears.
  13. A Google Chrome setup tab will now open. Leave this tab open, but open a new tab and navigate to chrome://gpu in the address bar. Confirm that WebGL and WebGL2 now show as "Hardware accelerated"
  14. Check that any sites showing a WebGL error are now functioning correctly.
  15. Log into your Google Account or follow the steps in the Google Chrome setup tab.

Cleanup

After you are all logged in and confirm your Chrome data is successfully synced, you should no longer need the Google Chrome disk image in your Downloads and the Chrome folder backup on your Desktop.

Final Note

I'm uncertain the precise cause of the WebGL issue to begin with, nor do I strongly believe this is more than a one-off bug. If the issue is common and someone else has a solution that doesn't require a Chrome wipe and reinstall, please submit your answer.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .