<html>
    <head>
      <base href="https://bugs.webkit.org/">
    </head>
    <body><table border="1" cellspacing="0" cellpadding="8">
        <tr>
          <th>Bug ID</th>
          <td><a class="bz_bug_link 
          bz_status_NEW "
   title="NEW - WebGL shader link error in iOS 15 beta: "Internal error compiling shader with Metal backend""
   href="https://bugs.webkit.org/show_bug.cgi?id=227723">227723</a>
          </td>
        </tr>

        <tr>
          <th>Summary</th>
          <td>WebGL shader link error in iOS 15 beta: "Internal error compiling shader with Metal backend"
          </td>
        </tr>

        <tr>
          <th>Product</th>
          <td>WebKit
          </td>
        </tr>

        <tr>
          <th>Version</th>
          <td>Safari Technology Preview
          </td>
        </tr>

        <tr>
          <th>Hardware</th>
          <td>iPhone / iPad
          </td>
        </tr>

        <tr>
          <th>OS</th>
          <td>Other
          </td>
        </tr>

        <tr>
          <th>Status</th>
          <td>NEW
          </td>
        </tr>

        <tr>
          <th>Severity</th>
          <td>Normal
          </td>
        </tr>

        <tr>
          <th>Priority</th>
          <td>P2
          </td>
        </tr>

        <tr>
          <th>Component</th>
          <td>WebGL
          </td>
        </tr>

        <tr>
          <th>Assignee</th>
          <td>webkit-unassigned@lists.webkit.org
          </td>
        </tr>

        <tr>
          <th>Reporter</th>
          <td>mturitzin@figma.com
          </td>
        </tr>

        <tr>
          <th>CC</th>
          <td>dino@apple.com, kbr@google.com, kkinnunen@apple.com
          </td>
        </tr></table>
      <p>
        <div>
        <pre>We are seeing this error (which is new in the iOS 15 beta) when linking some shader programs used by Figma's prototype viewer. I have personally repro'ed it on an iPad running iOS 15 (19A5281j). Shaders that previously compiled and linked without issue now fail when linking with this `getProgramInfoLog` message: 

  "Internal error compiling shader with Metal backend. Please submit this shader, or website as a bug to <a href="https://bugs.webkit.org">https://bugs.webkit.org</a>"

I have put together a minimal repro that appears to demonstrate the issue is with usage of the comma operator (see repro steps below). (We have a shader minifier that in some cases replaces semicolons with commas.) I believe the usage below is valid GLSL syntax, and it does compile and link properly on prior versions of Safari and other browsers.

Steps to Reproduce:

1. Run the following Javascript in Safari on iOS 15:
(JSFiddle link: <a href="https://jsfiddle.net/9p1f3t5r/2/">https://jsfiddle.net/9p1f3t5r/2/</a> )

----------------------------------------------------------------------------------------
const VERTEX_SHADER_SOURCE = "void f(vec2 a) {} void main() { f(vec2(0.)), gl_Position = vec4(0.,0.,0.,1.); }";
// Vertex shader with comma (in main()) changed to semicolon.
//const VERTEX_SHADER_SOURCE = "void f(vec2 a) {} void main() { f(vec2(0.)); gl_Position = vec4(0.,0.,0.,1.); }";
const FRAGMENT_SHADER_SOURCE = "void main() { gl_FragColor = vec4(0.); }";

const log = (msg) => {
        console.log(msg);
        document.body.innerHTML += "<p>" + msg + "</p>";
};

const canvas = document.createElement("canvas");
const gl = canvas.getContext("webgl");

const vertexShader = gl.createShader(gl.VERTEX_SHADER);
gl.shaderSource(vertexShader, VERTEX_SHADER_SOURCE);
gl.compileShader(vertexShader);
if (!gl.getShaderParameter(vertexShader, gl.COMPILE_STATUS)) {
        log("error compiling vertex shader: " + gl.getShaderInfoLog(vertexShader));
}

const fragmentShader = gl.createShader(gl.FRAGMENT_SHADER);
gl.shaderSource(fragmentShader, FRAGMENT_SHADER_SOURCE);
gl.compileShader(fragmentShader);
if (!gl.getShaderParameter(fragmentShader, gl.COMPILE_STATUS)) {
        log("error compiling fragment shader: " + gl.getShaderInfoLog(fragmentShader));
}

const program = gl.createProgram();
gl.attachShader(program, vertexShader);
gl.attachShader(program, fragmentShader);
gl.linkProgram(program);
if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
        log("error linking program: " + gl.getProgramInfoLog(program));
}

log("DONE");
----------------------------------------------------------------------------------------

Expected Results:

The shader program compiles/links without error.

Actual Results:

This error is logged when linking the program: "Internal error compiling shader with Metal backend. Please submit this shader, or website as a bug to <a href="https://bugs.webkit.org">https://bugs.webkit.org</a>".

An alternate version of the vertex shader with the usage of the comma operator in `main` replaced with a semicolon is included (commented out) in the repro code above. This change to the vertex shader causes the shader to compile/link without error.</pre>
        </div>
      </p>


      <hr>
      <span>You are receiving this mail because:</span>

      <ul>
          <li>You are the assignee for the bug.</li>
      </ul>
    </body>
</html>