Shader error in Three.js occurring on various computers with the same browser

For the last 3 months, I have been immersed in developing with Three.js, successfully using it across various browsers and computers. However, a week ago, an error started popping up on my home computer whenever I attempted to load my website:

three.js:29948 THREE.WebGLProgram: shader error:  0 gl.VALIDATE_STATUS false gl.getProgramInfoLog C:\fakepath(254,9-30): error X3004: undeclared identifier 'IncidentLight'

Warning: D3D shader compilation failed with default flags. (vs_3_0)
 Retrying with avoid flow control
C:\fakepath(254,9-30): error X3004: undeclared identifier 'webgl_45daf4aa877f103d'

Warning: D3D shader compilation failed with avoid flow control flags. (vs_3_0)
 Retrying with prefer flow control
C:\fakepath(254,9-30): error X3004: undeclared identifier 'webgl_45daf4aa877f103d'

Warning: D3D shader compilation failed with prefer flow control flags. (vs_3_0)
Failed to create D3D shaders.

Although the website functions properly and is live, it encounters issues on a select few computers, while running smoothly on those at my workplace. Despite ensuring that WebGL is enabled on the problematic browsers, the issue persists.

Answer №1

There appears to be a known issue affecting certain hardware in the latest version of Three.js - https://github.com/mrdoob/three.js/issues/8161

Fortunately, a fix for this issue has been implemented in the development branch. In the meantime, there is a workaround available:

When encountering compilation errors in functions

IncidentLight getPointDirectLight
and
IncidentLight getDirectionalDirectLight
, you can modify these functions to void types:

void getDirectionalDirectLight( out IncidentLight directLight, const in DirectionalLight directionalLight, const in GeometricContext geometry );

void getPointDirectLight( out IncidentLight directLight, const in PointLight pointLight, const in GeometricContext geometry );

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Serving sourcemaps for a web extension in Firefox: A step-by-step guide

Currently in the process of developing a web extension using TypeScript, I have encountered an issue with sourcemaps not loading properly. The use of parcel to bundle my extension has made the bundling process simple and straightforward. However, while the ...

What is the best way to eliminate the "onclick" attribute from an HTML element using JavaScript?

Is there a way to make my code only execute the onlick function after a button is pressed? I want to prevent any action from happening before that. <!-- deactivate onclick function --> <div class="boardsection2" id="2_8_7" oncl ...

Border becomes dashed when dragging and dropping

I am working on enabling drag and drop functionality for users. When an item is lifted from its original position, a gray dashed box should appear in its place. As the item is moved closer to another spot, the containers adjust to create a target area (gra ...

What is an alternative way to display static images in Rails 5 without relying on the Asset Pipeline?

I developed a web-based application with the backend built on Rails 5. Utilizing AngularJS for the frontend, I opted to not use the Asset Pipeline to deliver static content. Instead, I loaded all my scripts (JS & CSS) in the index.html file located within ...

Surprising outcome from the glob-fs glob.readdirSync function

Below is some nodejs code that I am working with. The client initially calls /api/demosounds and then calls /api/testsounds. var glob = require('glob-fs')({ gitignore: true }); app.get('/api/demosounds',function(req,res){ var d ...

Is it possible to connect ng-model with a style tag?

Is it feasible to create a basic template editor using angularjs where an input field with an ng-model can be connected to a style tag to control the css on an entire page rather than applying it to a specific element with inline styling? Could something ...

What steps can be taken to fix the recurring node error "EADDRINUSE"?

Having trouble running an http server through node as I keep encountering the EADDRINUSE error specifically on port 5000. I've attempted using sudo lsof -i tcp:5000 and sudo kill -9 [PID]. Here's a snippet of the shell command: Borealis:BackEnd g ...

EJS include function not working properly

In most cases, my EJS pages include the code below: <%- include('elements/fbviewpagepixel.ejs') %> Everything runs smoothly except for one particular page where I encountered an error message stating include is not a function. I managed t ...

Managing browser back button functionality

I've been struggling to find a solution for handling the browser back button event. I would like to prompt the user with a "confirm box" if they click on the browser back button. If they choose 'ok', I need to allow the back button action, ...

Fetching dynamic information via AJAX for a jQuery tooltip

I have successfully loaded content via AJAX, including a UL element with li items that each have tooltips. Now I want to load tooltip content via AJAX for each individual li item. How can I achieve this? Currently, I am making an AJAX call to load the li ...

Saving an array of key-value pairs in local storage

I'm attempting to save an array in local storage using the following code: var tempval = []; tempval['key'] = 1; localStorage.setItem("Message", JSON.stringify(tempval)); However, when I check local storage, it only sho ...

Encountering an error when importing chart.js-plugins-annotations

import { annotation, Chart, defaults } from 'chart.js'; An issue arises when using this import statement: localhost/:1 Uncaught TypeError: Failed to resolve module specifier "chart.js". Relative references must start with either &quo ...

What could be causing this jQuery color picker to malfunction when used inside a Bootstrap modal?

Currently, I am utilizing the fantastic jQuery color picker provided by Although it functions as expected in "normal" scenarios, I have encountered an issue where the picker fails to display when the input parent element is nested within a Bootstrap 3 mod ...

Setting up express with mongodb - A step-by-step guide

Currently exploring the world of Express App, I am attempting to configure mongodb using express and node.js. Facing a few issues in this process and seeking assistance. I have included directory references for better understanding. 1- The variable config ...

Error: module 'next/react' not found

Recently delving into next.js, I encountered an error after creating a project with npx create-next-app. Oddly enough, the app still runs despite this issue. { "resource": "/E:/codes/news-website/news-website/pages/index.js", ...

Make an angularJS PUT request using $http

After selecting a value from the dropdown selection, I am attempting to make a PUT call in AngularJS. Although I have successfully retrieved the value from the selection, I am encountering difficulty in generating the response for the PUT call. Below is t ...

Why is the view not reflecting the updates made to the model?

I recently started delving into Angular JS and have been following tutorials to learn it. One issue I'm facing is that my model doesn't seem to update the view. Can anyone help me figure out why this is happening? Here is the code snippet: < ...

Display sub-objects within Chart.js

I'm currently tackling a project in Ionic 3 where I am utilizing an API that returns a JSON response with nested objects. My goal is to display certain aspects of these objects within a bar graph using chart.js. Unfortunately, I lack experience in ma ...

Tool for obfuscating client-side files using node.js

I'm in search of a tool similar to the one found at but in the form of a node.js module, allowing for obfuscation of client-side js files prior to transmission. The tool mentioned above performs various tasks, with its most crucial function being th ...

A guide to leveraging Mongoose transactions when utilizing the updateMany method

While utilizing the mongoose updateMany() method within a transaction, I encountered some confusion. The documentation provides an example of using save() with a session, such as Model.save({session: mySession}), but I am unsure how to apply this to Model. ...