Sudden problems with microsoft edge / webgl
in JATOS
I suddenly can't open my experiment in the Microsoft Edge Browser. It leaves a blank page. In the page source you can see that the problems stems from the browser not supporting WebGl. Now i did some general testing and i actually think that WebGL is running on my browser. So i wanted to ask you guys if you think the problem is on my end or with Microsoft Edge and if you have any possible solutions?
I use a general multiple link. It worked until now. It still works in firefox and qutebrowser.
This thread lead me to WebGL problem.
Mircrosoft Edge is up to date.
<!DOCTYPE html>
<!--
OSWEB is distributed under the terms of the GNU General Public License 3.
The full license should be included in the file COPYING,
or can be obtained from: http://www.gnu.org/licenses/gpl.txt
-->
<html>
<head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<meta content="IE=edge" http-equiv="X-UA-Compatible"/>
<title>
OSWeb
</title>
<script src="/assets/javascripts/jatos.js">
</script>
<script id="parameters" type="text/javascript">
const params = JSON.parse('{"subject": "0,1", "fullscreen": true, "fullBackgroundColor": false, "welcomeText": "", "externalJS": [], "introClick": true}')
const osexpFile = "358b771a-08a1-1640-2d47-88c717df5061.osexp"
const jatosAssetsFolder = "a47ee561-4ea2-80d4-f47b-548d9201c9ec"
const jatosComponentHash = "358b771a-08a1-1640-2d47-88c717df5061"
</script>
<script src="js/osweb.92488aa609000e3644d2.bundle.js" type="text/javascript">
</script>
<script src="js/vendors~osweb.ccbf0e07232eb9eb0239.bundle.js" type="text/javascript">
</script>
<script src="js/jatos.js" type="text/javascript">
</script>
<script src="js/_shared.js" type="text/javascript">
</script>
<link href="css/osweb.92488aa609000e3644d2.bundle.css" media="all" rel="stylesheet" type="text/css"/>
<link href="css/vendors~osweb.ccbf0e07232eb9eb0239.bundle.css" media="all" rel="stylesheet" type="text/css"/>
<link href="css/jatos.css" media="all" rel="stylesheet" type="text/css"/>
</head>
<body onload="onPageLoad()">
<main class="d-flex justify-content-center flex-column stretch">
<div id="webgl-unavailable">
<p>
Your browser does not support WebGL, which is required for this experiment.
</p>
<p>
😕
</p>
<p>
Please try another browser or another computer.
</p>
</div>
<div id="osweb_loading">
<p>
⏳
</p>
</div>
<div class="osweb-canvas-container">
<div class="aspectwrapper" id="osweb_div">
</div>
</div>
</main>
<div id="modal">
<div class="box">
<div class="content">
<div class="icon">
<div class="lds-ripple">
<div>
</div>
<div>
</div>
</div>
<div class="error">
<img src="img/warning.png"/>
</div>
</div>
<div class="text">
<div class="title">
</div>
<div class="message">
</div>
</div>
</div>
</div>
</div>
<div id="filePool" style="display:none;">
<img id="4-yellow-triangle.png" src="pool\4-yellow-triangle.png"/>
<img id="4-yellow-star.png" src="pool\4-yellow-star.png"/>
<img id="4-yellow-cross.png" src="pool\4-yellow-cross.png"/>
<img id="4-yellow-circle.png" src="pool\4-yellow-circle.png"/>
<img id="4-red-triangle.png" src="pool\4-red-triangle.png"/>
<img id="4-red-star.png" src="pool\4-red-star.png"/>
<img id="4-red-cross.png" src="pool\4-red-cross.png"/>
<img id="4-red-circle.png" src="pool\4-red-circle.png"/>
<img id="4-green-triangle.png" src="pool\4-green-triangle.png"/>
<img id="4-green-star.png" src="pool\4-green-star.png"/>
<img id="4-green-cross.png" src="pool\4-green-cross.png"/>
<img id="4-green-circle.png" src="pool\4-green-circle.png"/>
<img id="4-blue-triangle.png" src="pool\4-blue-triangle.png"/>
<img id="4-blue-star.png" src="pool\4-blue-star.png"/>
<img id="4-blue-cross.png" src="pool\4-blue-cross.png"/>
<img id="4-blue-circle.png" src="pool\4-blue-circle.png"/>
<img id="3-yellow-triangle.png" src="pool\3-yellow-triangle.png"/>
<img id="3-yellow-star.png" src="pool\3-yellow-star.png"/>
<img id="3-yellow-cross.png" src="pool\3-yellow-cross.png"/>
<img id="3-yellow-circle.png" src="pool\3-yellow-circle.png"/>
<img id="3-red-triangle.png" src="pool\3-red-triangle.png"/>
<img id="3-red-star.png" src="pool\3-red-star.png"/>
<img id="3-red-cross.png" src="pool\3-red-cross.png"/>
<img id="3-red-circle.png" src="pool\3-red-circle.png"/>
<img id="3-green-triangle.png" src="pool\3-green-triangle.png"/>
<img id="3-green-star.png" src="pool\3-green-star.png"/>
<img id="3-green-cross.png" src="pool\3-green-cross.png"/>
<img id="3-green-circle.png" src="pool\3-green-circle.png"/>
<img id="3-blue-triangle.png" src="pool\3-blue-triangle.png"/>
<img id="3-blue-star.png" src="pool\3-blue-star.png"/>
<img id="3-blue-cross.png" src="pool\3-blue-cross.png"/>
<img id="3-blue-circle.png" src="pool\3-blue-circle.png"/>
<img id="2-yellow-triangle.png" src="pool\2-yellow-triangle.png"/>
<img id="2-yellow-star.png" src="pool\2-yellow-star.png"/>
<img id="2-yellow-cross.png" src="pool\2-yellow-cross.png"/>
<img id="2-yellow-circle.png" src="pool\2-yellow-circle.png"/>
<img id="2-red-triangle.png" src="pool\2-red-triangle.png"/>
<img id="2-red-star.png" src="pool\2-red-star.png"/>
<img id="2-red-cross.png" src="pool\2-red-cross.png"/>
<img id="2-red-circle.png" src="pool\2-red-circle.png"/>
<img id="2-green-triangle.png" src="pool\2-green-triangle.png"/>
<img id="2-green-star.png" src="pool\2-green-star.png"/>
<img id="2-green-cross.png" src="pool\2-green-cross.png"/>
<img id="2-green-circle.png" src="pool\2-green-circle.png"/>
<img id="2-blue-triangle.png" src="pool\2-blue-triangle.png"/>
<img id="2-blue-star.png" src="pool\2-blue-star.png"/>
<img id="2-blue-cross.png" src="pool\2-blue-cross.png"/>
<img id="2-blue-circle.png" src="pool\2-blue-circle.png"/>
<img id="1-yellow-triangle.png" src="pool\1-yellow-triangle.png"/>
<img id="1-yellow-star.png" src="pool\1-yellow-star.png"/>
<img id="1-yellow-cross.png" src="pool\1-yellow-cross.png"/>
<img id="1-yellow-circle.png" src="pool\1-yellow-circle.png"/>
<img id="1-red-triangle.png" src="pool\1-red-triangle.png"/>
<img id="1-red-star.png" src="pool\1-red-star.png"/>
<img id="1-red-cross.png" src="pool\1-red-cross.png"/>
<img id="1-red-circle.png" src="pool\1-red-circle.png"/>
<img id="1-green-triangle.png" src="pool\1-green-triangle.png"/>
<img id="1-green-star.png" src="pool\1-green-star.png"/>
<img id="1-green-cross.png" src="pool\1-green-cross.png"/>
<img id="1-green-circle.png" src="pool\1-green-circle.png"/>
<img id="1-blue-triangle.png" src="pool\1-blue-triangle.png"/>
<img id="1-blue-star.png" src="pool\1-blue-star.png"/>
<img id="1-blue-cross.png" src="pool\1-blue-cross.png"/>
<img id="1-blue-circle.png" src="pool\1-blue-circle.png"/>
</div>
</body>
</html>
That is the error message.
Comments
Hi @Stonesitter ,
Do you see an error message in the browser console?
— Sebastiaan
Check out SigmundAI.eu for our OpenSesame AI assistant!