Bug 273074 - Screen-space refraction demo doesn't work on iPhone 15
Summary: Screen-space refraction demo doesn't work on iPhone 15
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: WebGL (show other bugs)
Version: WebKit Nightly Build
Hardware: iPhone / iPad iOS 17
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2024-04-22 10:54 PDT by Kenneth Russell
Modified: 2024-04-29 10:55 PDT (History)
4 users (show)

See Also:


Attachments
Screen shot of incorrect rendering (344.14 KB, image/jpeg)
2024-04-22 10:54 PDT, Kenneth Russell
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Kenneth Russell 2024-04-22 10:54:53 PDT
Created attachment 471043 [details]
Screen shot of incorrect rendering

https://domenicobrz.github.io/webgl/projects/SSRefractionDepthPeeling/ renders incorrectly on an iPhone 15 Pro Max running iOS 17.4.1. It renders correctly on desktop Safari on Apple Silicon.

Could this be related to GPU register pressure, and failure to compile certain shaders? I don't have a DevTools debugging environment set up for this configuration.
Comment 1 Kenneth Russell 2024-04-22 12:54:28 PDT
Note: source code for this demo is https://github.com/Domenicobrz/Domenicobrz.github.io/tree/master/webgl/projects/SSRefractionDepthPeeling .

I've contacted the demo author; he won't be able to debug this soon, but if it's possible to narrow down the cause of the failure on iPhones, this might inform more general fixes to ANGLE.
Comment 2 Kimmo Kinnunen 2024-04-22 20:32:19 PDT
The doubleDepthBuffer has this:

        this.ping = new THREE.WebGLRenderTarget(innerWidth, innerHeight, {
            type:          THREE.FloatType,
            depthBuffer:   false,
            stencilBuffer: false,
        });

        this.pong = new THREE.WebGLRenderTarget(innerWidth, innerHeight, {
            type:          THREE.FloatType,
            depthBuffer:   false,
            stencilBuffer: false,
        });

        this.frontFaceRT = new THREE.WebGLRenderTarget(innerWidth, innerHeight, {
            type:          THREE.FloatType,
        });

It may use the EXT_float_blend to do the rendering, which iOS doesn't support..
Comment 3 Kenneth Russell 2024-04-25 16:44:10 PDT
For the record, Alexey Knyazev diagnosed this and it seems to be a bug in the demo where it assumes the presence of OES_texture_float_linear, which doesn't exist on iOS. This is a common problem causing un-portability of WebGL apps to iOS so we're going to update the WebGL Best Practices on MDN to highlight this, and also try to propose a PR against the upstream demo to use fp16 textures rather than fp32, which will also implicitly fix this problem.
Comment 4 Radar WebKit Bug Importer 2024-04-29 10:55:16 PDT
<rdar://problem/127242438>