logarithmicDepthBuffer doesnt render objects

[PuRainDev]

Hi! Im trying to use logarithmicDepthBuffer : true, because my models are flashing.
But after adding it i receive this error:

three.js:15381 THREE.WebGLRenderer: EXT_frag_depth extension not supported.
get @ three.js:15381
generateExtensions @ three.js:16979
WebGLProgram @ three.js:17179
WebGLPrograms.acquireProgram @ three.js:17910
initMaterial @ three.js:24137
setProgram @ three.js:24297
WebGLRenderer.renderBufferDirect @ three.js:23313
renderObject @ three.js:24041
renderObjects @ three.js:24011
WebGLRenderer.render @ three.js:23802
(anonymous) @ (index):392
(anonymous) @ (index):406
animate @ (index):405
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
initialize @ (index):397
init @ (index):93
(anonymous) @ (index):53
Promise.then (async)
window.onload @ (index):51
load (async)
(anonymous) @ (index):47
three.js:16876 THREE.WebGLShader: Shader couldn't compile.
WebGLShader @ three.js:16876
WebGLProgram @ three.js:17473
WebGLPrograms.acquireProgram @ three.js:17910
initMaterial @ three.js:24137
setProgram @ three.js:24297
WebGLRenderer.renderBufferDirect @ three.js:23313
renderObject @ three.js:24041
renderObjects @ three.js:24011
WebGLRenderer.render @ three.js:23802
(anonymous) @ (index):392
(anonymous) @ (index):406
animate @ (index):405
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
animate @ (index):399
requestAnimationFrame (async)
initialize @ (index):397
init @ (index):93
(anonymous) @ (index):53
Promise.then (async)
window.onload @ (index):51
load (async)
(anonymous) @ (index):47
three.js:16882 THREE.WebGLShader: gl.getShaderInfoLog() vertex ERROR: 0:189: 'EPSILON' : undeclared identifier

I got this issue on Android 10, Chrome 94.0.4606.85
Will be glad to receive any help.

P.S. I was using obj models, but without them I got this error too. Without logarithmicDepthBuffer all wotks fine, exept flashing parts on models.

[kalwalt]

Hi @PuRainDev Can you give us more infos? What are you using pattern marker, NFT markers or location based? Are you using the master branch or dev branch?

[PuRainDev]

Im using master branch with Patter Marker. Three,js library.
I made a small example with hire pattern. live demo: http://purpleflowers.ml/arerror/
(I use chrome flag treat insecure origins as secure)
Without logarithmicDepthBuffer I got this type of glitches:
https://pasteboard.co/2JQ05WklLHhN.png
After applying logarithmicDepthBuffer i got nothing at all exept video and that error.
I also attached my small example as a zip archive
arerror.zip
Is that enough information?

[PuRainDev]

Steps to reproduce my issue:
Open live demo
Hover phone to hiro marker
then I got that error with some shader code

[kalwalt]

i'm trying to testing your app but i get a webRTC issue. can't open my webcam. Testing with a desktop machine running Ubuntu 20.04.
But as i can see you are using a Three.js version 103 can you update to a more recent one? Also it could be that you need to add these lines:

renderer.outputEncoding = THREE.sRGBEncoding;
renderer.physicallyCorrectLights = true;
let directionalLight = new THREE.DirectionalLight('#fff', 0.4);
directionalLight.position.set(0.5, 0, 0.866);
// after scene is initialized...
scene.add(directionalLight)

[PuRainDev]

I have tried to update to three.js 111 but nothing changes
then I updated three.js to 135
and used ar-threex.js from dev branch
and suddenly it starts working
BUT there is another issue now: 3d models are not correclty rendered:
https://postimg.cc/94q98Z9r
And it doesnt change when I remove logarithmicDepthBuffer
All changes are updated http://purpleflowers.ml/arerror/
arerror2.zip
P.S. On my windows machine I got the same error, but on my android phone there are no such webrtc errors. I also got such en error on google meet.

[PuRainDev]

any ideas?