Three.js: Error creating WebGL context

Created on 16 Jun 2014  ·  64Comments  ·  Source: mrdoob/three.js

I am getting

Error creating WebGL context.
Uncaught TypeError: Cannot read property 'getExtension' of null

on http://threejs.org/examples and my website http://arefin.in ( r58 ).
chrome:// gpu / shows everything enabled.

What do you think is wrong ?

Browser Issue

Most helpful comment

Same for me. I've found out that my GPU (Intel HD 3000) is now blacklisted on Chrome (check yours at chrome://gpu/). I went to chrome://flags/ and enabled the --ignore-gpu-blacklist flag. Now everything is back to normal.

All 64 comments

You should share your system specs. (CPU, OS, Graphics card model, drivers version, browser...)

AMD FX-4130, Win 7 build 7600, GeForce GTX 650 running 9.18.13.2018, Chrome 35.0.1916.153 m.
Things were fine about a week ago. Been running my website since May 2013.

Latest drivers? Tried on other browser?

I mean, if things used to work and you haven't changed the code, it's probably something related to the OS, browser and/or graphic drivers...

I think the latest dev channel Chrome on Windows is doing something funny after update. After updating just now, threejs can't create the webgl context on any example - was working fine right before the update.

Chrome version 37.0.2054.2 dev-m (64-bit)
Windows 8.1 64-bit
ATI Radeon HD 6800 series
ATI Driver Packaging Version 14.10.1006-140417a-171099C

chrome://gpu shows
"WebGL: Unavailable. Hardware acceleration unavailable"
It also shows that the --disable-gpu flag was passed to chrome.exe!

Killing all chrome.exe processes and running by executing chrome.exe directly (in C:\Program Files (x86)Google\ChromeApplication) seems to solve this. Check your shortcuts to ensure the flag isn't getting passed.

Maybe this isn't the same issue but check this first if you see this issue after updating.

Let me try that and get back to you. I saw this issue here as well - http://japhr.blogspot.in/2014/05/webgl-in-chrome-36-linux-is-not-working.html

Thanks

Now everything's back to normal. I guess things fixed themselves when Chrome updated ? Most people didn't face this issue, maybe only a handful. Still, Chrome should address problems like these.
I guess you can close this issue.
Thanks

Restarting Chrome fixed this for me.

still i have a problem after restarting chrome my chrome Version 37.0.2062.120 (64-bit)....please help me to resolve this problem.

and its on ubuntu linux 13.04

Latest Chrome for linux is 39.0.2171.95.

I have the same trouble (Error creating WebGL context.) with the latest version, 39.0.217.95 (64-bits) on Ubuntu 14.10.

Sorry to resurrect this thread, but I have the same issue (error creating WebGL context, Cannot read property getExtension of null), Chrome 47.0.2526.106 (64), Ubuntu 15.10, nVidia Optimus on dedicated gpu (three.js doesn't run at all if I set it to integrated). I don't really care because I generally use Firefox, but other people might and it prevents me from testing with Chrome.

Same issue here, on both Dev channel and Canary, it's been happening for weeks. three.js works on FF but not Chrome. Pretty big issue because I mainly use Chrome.

Chrome 49.0.2609.0 canary (64-bit), 49.0.2593.0 dev-m (64-bit), Windows 8.1, nVidia Optimus

@jwlarocque @GameKyuubi

In these situation it's best to check https://get.webgl.org/. If that page doesn't work, there is nothing three.js can do about it, and you should report the issue to Google/Chrome instead.

Yeah it's broken there. Really strange that a problem like this would go
unnoticed for so long tho.
On Jan 2, 2016 5:09 PM, "Mr.doob" [email protected] wrote:

@jwlarocque https://github.com/jwlarocque @GameKyuubi
https://github.com/GameKyuubi

In these situation it's best to check https://get.webgl.org/. If that
page doesn't work, there is nothing three.js can do about it, and you
should report the issue to Google/Chrome instead.


Reply to this email directly or view it on GitHub
https://github.com/mrdoob/three.js/issues/4927#issuecomment-168372764.

I would like to point out that on my Mac which has a switching Nvidia GPU, modifying its GPU switch behavior e.g. with gfxCardStatus is likely to cause Chrome to fail at creating the context until such time as you quit Chrome and re-open it. This is one way I am able to make the issue manifest on this particular machine.

This is the type of issue that a logout/reboot can often address quite nicely.

Make sure this option is selected in your chrome settings.
screen shot 2016-02-09 at 1 59 46 pm

Yeah that's not the problem at all. It's been checked the whole time, the problem still persists even with the most recent Chrome Canary update and most recent NVIDIA drivers.

This seems to have randomly happened after doing some intense testing of a Three.js app. One moment everything was rendering fine, now I can't load any WebGL contexts. Hardware acceleration is turned on in settings. However in chrome://gpu:

Rasterization: Software only. Hardware acceleration disabled
Canvas: Software only, hardware acceleration unavailable

Any ideas?

I'm also seeing this problem on Linux. Restarting Chrome does not fix it.

I get the same error "Error creating WebGL context." on Chrome 50.0.2661.75 m (64-bit) /Windows 7.
The driver should be fine since I do not have any problem loading the same page in Firefox.

@JamesMilnerUK Same issue here, loaded a lot of collada models, froze the browser until it crashed and now I can no longer get a WebGL context. Closing/reopening Chrome didn't fix it. Were you able to find a resolution?

Edit: Found a fix -- had to uncheck hardware acceleration, restart, recheck it and restart again

Started from restarting Chrome and restarting Mac

Mac - Chrome - Version 52.0.2743.116 (64-bit) - OK

Mac - Chrome Canary - Version 55.0.2850.0 canary (64-bit) - FAIL

THREE.WebGLRenderer: Error creating WebGL context.WebGLRenderer @ three.js:19571
Uncaught TypeError: Cannot read property 'getExtension' of null
    at Object.get (three.js:16906)
    at new WebGLRenderer (three.js:19577)
    at init ((index):59)
    at (index):54
                    case 'WEBGL_depth_texture':
                        extension = gl.getExtension( 'WEBGL_depth_texture' ) || gl.getExtension( 'MOZ_WEBGL_depth_texture' ) || gl.getExtension( 'WEBKIT_WEBGL_depth_texture' );
                        break;

I tried chrome://flags/ and enabled this one:

WebGL Draft Extensions Mac, Windows, Linux, Chrome OS, Android
Enabling this option allows web applications to access the WebGL Extensions that are still in draft status.

Still no luck...

Canary? You should probably report the regression to the Chromium project.

S**T!!!

My Chrome auto updated - the stable is at 53.0.2785.101 and stopped working, so did I...

EDIT:

Bug Report: https://bugs.chromium.org/p/chromium/issues/detail?id=645390

Same for me. I've found out that my GPU (Intel HD 3000) is now blacklisted on Chrome (check yours at chrome://gpu/). I went to chrome://flags/ and enabled the --ignore-gpu-blacklist flag. Now everything is back to normal.

Chrome sometimes adds drivers to its blacklist between releases. My samsung galaxy s6 didn't have webgl 1 month and the next month it did because chrome removed it from the blacklist. Things can go the other way too. You can ignore the blacklist at your own peril though. I ignored it with my phone, and everything _did_ work fine.

ie + firefox worked, chrome latest did not one one of my dev. systems, latest Nvideo Quadro drivers for 2011 card...
Fixed by going into advanced settings of Chrome - Use hardware Acc. GFX was unchecked, checked it - restarted and now working

I miss flash :-( - I simply cannot expect end users to go through this hassle

I'm getting the same exception after undetermined amounts of time in Chrome. It happens only very occasionally and it only seems to be when its a full-screen scene, but the only way to fix it that I can find so far is to restart the browser, which isn't good enough on a public site! I can create contexts ok for quite a while but suddenly it will fail when I try to new THREE.WebGLRenderer() again so it can't be due to blacklisted gfx cards. I'm unable to reproduce it ad-hoc though which is making it virtually impossible to fix. Anyone have any ideas how to track down the root cause?

Hardware acceleration is enabled.

Error creating WebGL context.
Uncaught TypeError: Cannot read property 'getExtension' of null

yep, happening to me too as of now - Chrome on Macbook Pro OS 10.11.5

@deejbee @cindyloo it would be helpful if you guys could share your hardware information.

@mrdoob It is Intel HD Graphics 530 running Win10. The driver version is 4.4.0 Build 10.18.15.4279. It's a Dell Optiplex 7040

GPU Caps Viewer v1.31.1.0 report

same here

Maybe fallback on CanvasRenderer in such case?

What the hell, this is happening on Win10 with current Chrome, any new hint on how to solve this? Works even in Internet Explorer :)

@alberto2000 what GPU do you have?

@mrdoob it was a Radeon card and reinstalling the drivers solved it.

getting this also, not often but occasionally.

OS
Mac OS 10.11.6
Browser
Chrome 54.0.2840.98

For any one reading this in 2017, I fixed this on my MacBook Pro Late 2011 by disabling power saver automatic graphics card switching to force high performance GPU to take over all the time.

I'm still seeing these come in from our server logs. Most recent was from:
OS: Windows 10
Browser: Chrome 55.0.2883.87

Note: we're running release r74 (until the fog issue that was recently resolved is merged into a new release 👍)

Note: we're running release r74 (until the fog issue that was recently resolved is merged into a new release 👍)

What fog issue?

Ah, I see!

Turning on "use hardware acceleration where available" in chrome's advanced settings fixed my problem

I saw this error pop up in the error tracking system I use. In case it's helpful, here's the system info for the user that had a bug as captured by the tracker:

User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36
OS: Mac OS X 10.12.3
Browser: Chrome 56.0.2924

And here is what the error tracker caught in the console:

THREE.WebGLRenderer 84
THREE.WebGLRenderer: Error creating WebGL context.
TypeError: Cannot read property 'getExtension' of null

That system info is missing the Graphics Card details to be fully useful.

Graphics card: Intel HD Graphics 4000 1024 MB

I was able to talk to the user that hit this error, and they passed along the graphics card info above. Hope that helps! Thank you!

@kenrussell Is Intel HD Graphics 4000 baclkisted? Actually, is there a public list of blacklisted graphics cards?

@mrdoob No, the Intel HD 4000's not blacklisted.

Need the contents of about:gpu (plaintext is preferred, just copy/paste) to diagnose issues like this.

If the card is blacklisted then the reason why will be described on that page.

These two files describe which GPUs are blacklisted and which have driver bug workarounds applied.

https://cs.chromium.org/chromium/src/gpu/config/software_rendering_list_json.cc

https://cs.chromium.org/chromium/src/gpu/config/gpu_driver_bug_list_json.cc

Note though that a refactoring is underway so these two files will likely be replaced by .json files in the same directory in the next week or two. See http://crbug.com/691703 .

I have the same error...
It seems as Intel HD 2000 is blacklisted in Chrome 58.0.3029.81 (64-bit), Ubuntu 14.04
I set chrome://flags/ --ignore-gpu-blacklist ; and it works fine.

If it's any help to anyone looking at this from a different angle. I get this error when trying to mount a react component containing THREE bits and bobs when attempting to test it.

I'm making it as not testable for the time being.

@YoneMoreno I don't see a Error creating WebGL context. in your issue. What makes you think you're having this same issue?

Why is this closed? It looks like a lot of people are still experiencing this issue.

@nicolethenerd Unfortunately, there is nothing what we can do in the library.

You could add a more helpful error message. Skimming through this thread, it's hard to get a sense of what the resolution actually was - people claim to have resolved this by changing a few different flags.

If the solution is more complicated than can fit in an error message, having the message link out to a FAQ page that explains the problem and recommends which flags to set depending on your browser.

If this is a common error that cannot be resolved by fixing the library, maybe add it to an FAQ section of the demo site?

@nicolethenerd If I recall correctly, it was Chrome's hardware acceleration flag that needed to be turned on for my 2012 MacBook Pro.

The graphics card is only one of the reasons why the context can't be created. We wouldn't want to add a message that could be misleading.

Maybe we could start collecting reasons.

However, we shouldn't recommend users disabling blacklisting. If these graphic cards have been blacklisted is due to bugs and/or security reasons.

I saw this response when I had too many tabs with WebGL scenes open at the same time.

Same error for me with Version 72.0.3626.121 (Official Build) Arch Linux (64-bit). Works with Firefox 65.0.1 on the same OS.

GPU: NVidia 2080TI.

Make sure this option is selected in your chrome settings.
screen shot 2016-02-09 at 1 59 46 pm
After relaunching the chrom setting, the WebGL works rightly as it does before.
Good answer.

Error: Failed to create WebGL context: WebGL creation failed:

  • GL_MAX_COMBINED_TEXTURE_IMAGE_UNITS: 0 is < 8!

I'm getting this now, in Firefox 74. I have forced webgl.force-enabled=true in the config, enabled hardware acceleration, nothing. It worked just fine for me in 66 but I guess their "quantum" update broke damn near everything, including webgl for me.

Make sure you're not calling the WebGL context initializer from a listener (e.g. try writing it within your init function with a boolean flag to stop it from looping or stating gl as global variable). The former worked for me and displays the context correctly.

EDIT: Actually I've ended up finding the WebGL canvas inside of the renderer (THREE.WebGLRenderer). I used the canvas method renderer.getContext().canvas and added webglcontextlost listener, which in turn called handleContextLost function with the init().

function handleContextLost() {
    event.preventDefault();
    cancelAnimationFrame(requestId)
    init();
}

canvas.addEventListener("webglcontextlost", handleContextLost, false)

Was this page helpful?
0 / 5 - 0 ratings

Related issues

konijn picture konijn  ·  3Comments

seep picture seep  ·  3Comments

makc picture makc  ·  3Comments

jack-jun picture jack-jun  ·  3Comments

Horray picture Horray  ·  3Comments