Failed to compile fragment shader

TensorFlow.js version : 1.0.0

Browser version: Chromium - Version 74.0.3729.169 (Official Build) Built on Ubuntu , running on Ubuntu 18.04 (64-bit)

I get the following error whenever I try to load model from indexeddb. Predict works in case of using the mobilenet model hosted by Google.

#version 300 es
    precision highp float;
    precision highp int;
    precision highp sampler2D;
    in vec2 resultUV;
    out vec4 outputColor;
    const vec2 halfCR = vec2(0.5, 0.5);

    struct ivec5
    {
      int x;
      int y;
      int z;
      int w;
      int u;
    };

    struct ivec6
    {
      int x;
      int y;
      int z;
      int w;
      int u;
      int v;
    };

    
      bool isNaN(float val) {
        return (val < 1.0 || 0.0 < val || val == 0.0) ? false : true;
      }

      bvec4 isNaN(vec4 val) {
        return bvec4(
          isNaN(val.x),
          isNaN(val.y),
          isNaN(val.z),
          isNaN(val.w)
        );
      }

      bool hasNaN(vec4 values) {
        return any(bvec4(
          isNaN(values.x),
          isNaN(values.y),
          isNaN(values.z),
          isNaN(values.w)
        ));
      }
    

    float getNaN(vec4 values) {
      return dot(vec4(1), values);
    }

    
      #define round(value) newRound(value)
      int newRound(float value) {
        return int(floor(value + 0.5));
      }

      ivec4 newRound(vec4 value) {
        return ivec4(floor(value + vec4(0.5)));
      }
    

    int imod(int x, int y) {
      return x - y * (x / y);
    }

    //Based on the work of Dave Hoskins
    //https://www.shadertoy.com/view/4djSRW
    #define HASHSCALE1 443.8975
    float random(float seed){
      vec2 p = resultUV * seed;
      vec3 p3  = fract(vec3(p.xyx) * HASHSCALE1);
      p3 += dot(p3, p3.yzx + 19.19);
      return fract((p3.x + p3.y) * p3.z);
    }

    
vec2 uvFromFlat(int texNumR, int texNumC, int index) {
  int texR = index / texNumC;
  int texC = index - texR * texNumC;
  return (vec2(texC, texR) + halfCR) / vec2(texNumC, texNumR);
}
vec2 packedUVfrom1D(int texNumR, int texNumC, int index) {
  int texelIndex = index / 2;
  int texR = texelIndex / texNumC;
  int texC = texelIndex - texR * texNumC;
  return (vec2(texC, texR) + halfCR) / vec2(texNumC, texNumR);
}

    
vec2 packedUVfrom2D(int texelsInLogicalRow, int texNumR,
  int texNumC, int row, int col) {
  int texelIndex = (row / 2) * texelsInLogicalRow + (col / 2);
  int texR = texelIndex / texNumC;
  int texC = texelIndex - texR * texNumC;
  return (vec2(texC, texR) + halfCR) / vec2(texNumC, texNumR);
}

    
vec2 packedUVfrom3D(int texNumR, int texNumC,
    int texelsInBatch, int texelsInLogicalRow, int b,
    int row, int col) {
  int index = b * texelsInBatch + (row / 2) * texelsInLogicalRow + (col / 2);
  int texR = index / texNumC;
  int texC = index - texR * texNumC;
  return (vec2(texC, texR) + halfCR) / vec2(texNumC, texNumR);
}

  
  float getChannel(vec4 frag, vec2 innerDims) {
    vec2 modCoord = mod(innerDims, 2.);
    return modCoord.x == 0. ?
      (modCoord.y == 0. ? frag.r : frag.g) :
      (modCoord.y == 0. ? frag.b : frag.a);
  }
  float getChannel(vec4 frag, int dim) {
    float modCoord = mod(float(dim), 2.);
    return modCoord == 0. ? frag.r : frag.g;
  }


    float sampleTexture(sampler2D textureSampler, vec2 uv) {
      return texture(textureSampler, uv).r;
    }
  

    void setOutput(vec4 val) {
      outputColor = val;
    }
  
uniform sampler2D A;
uniform int offsetA;

    ivec4 getOutputCoords() {
      ivec2 resTexRC = ivec2(resultUV.yx *
                             vec2(112, 448));
      int index = resTexRC.x * 448 + resTexRC.y;

      
      int b2 = index / 50176;
      index -= b2 * 50176;
    

      int b = index / 224;
      index -= b * 224;

      int r = 2 * (index / 2);
      int c = imod(index, 2) * 2;

      return ivec4(b2, b, r, c);
    }
  

    vec4 getA(int b2, int b, int row, int col) {
      int index = b2 * 25000000 + b * 5000 + (row / 2) * 2 + (col / 2);
      int texR = index / 10000;
      int texC = index - texR * 10000;
      vec2 uv = (vec2(texC, texR) + halfCR) / vec2(10000, 2500);
      return texture(A, uv);
    }
  
    vec4 getAAtOutCoords() {
      ivec4 coords = getOutputCoords();
      
      vec4 outputValue = getA(coords.x, coords.y, coords.z, coords.w);
      return outputValue;
    }
  

      const vec3 effectiveInputOverOutputRatioRC = vec3(
          22.321428571428573,
          22.321428571428573,
          22.321428571428573);
      const vec3 inputShapeRC = vec3(5000.0, 5000.0,
                                     5000.0);

      float getAValue(int b, int r, int c, int d) {
        return getChannel(getA(b, r, c, d), vec2(c, d));
      }

      void main() {
        ivec4 coords = getOutputCoords();
        int b = coords[0];
        int d = coords[3];
        // Calculate values for next column in yRC.z.
        ivec3 yRC = coords.yzz + ivec3(0, 0, 1);

        // Fractional source index.
        vec3 sourceFracIndexRC = vec3(yRC) * effectiveInputOverOutputRatioRC;

        // Compute the four integer indices.
        ivec3 sourceFloorRC = ivec3(sourceFracIndexRC);
        ivec3 sourceCeilRC = ivec3(
          min(inputShapeRC - 1.0, ceil(sourceFracIndexRC)));
        
        // Should we calculate next column and row elements in 2x2 packed cell.
        bool hasNextCol = d < 2; 
        bool hasNextRow = coords.z < 223;

        // In parallel, construct four corners for all four components in
        // packed 2x2 cell.
        vec4 topLeft = vec4(
          getAValue(b, sourceFloorRC.x, sourceFloorRC.y, d),
          hasNextCol ? getAValue(b, sourceFloorRC.x, sourceFloorRC.y, d + 1)
                     : 0.0,
          hasNextRow ? getAValue(b, sourceFloorRC.x, sourceFloorRC.z, d)
                     : 0.0,
          (hasNextRow && hasNextCol) ?
            getAValue(b, sourceFloorRC.x, sourceFloorRC.z, d + 1) : 0.0);

        vec4 bottomLeft = vec4(
          getAValue(b, sourceCeilRC.x, sourceFloorRC.y, d),
          hasNextCol ? getAValue(b, sourceCeilRC.x, sourceFloorRC.y, d + 1)
                     : 0.0,
          hasNextRow ? getAValue(b, sourceCeilRC.x, sourceFloorRC.z, d)
                     : 0.0,
          (hasNextRow && hasNextCol) ?
            getAValue(b, sourceCeilRC.x, sourceFloorRC.z, d + 1) : 0.0);

        vec4 topRight = vec4(
          getAValue(b, sourceFloorRC.x, sourceCeilRC.y, d),
          hasNextCol ? getAValue(b, sourceFloorRC.x, sourceCeilRC.y, d + 1)
                     : 0.0,
          hasNextRow ? getAValue(b, sourceFloorRC.x, sourceCeilRC.z, d)
                     : 0.0,
          (hasNextRow && hasNextCol) ?
            getAValue(b, sourceFloorRC.x, sourceCeilRC.z, d + 1) : 0.0);

        vec4 bottomRight = vec4(
          getAValue(b, sourceCeilRC.x, sourceCeilRC.y, d),
          hasNextCol ? getAValue(b, sourceCeilRC.x, sourceCeilRC.y, d + 1)
                     : 0.0,
          hasNextRow ? getAValue(b, sourceCeilRC.x, sourceCeilRC.z, d)
                     : 0.0,
          (hasNextRow && hasNextCol) ?
            getAValue(b, sourceCeilRC.x, sourceCeilRC.z, d + 1) : 0.0);

        vec3 fracRC = sourceFracIndexRC - vec3(sourceFloorRC);

        vec4 top = mix(topLeft, topRight, fracRC.yyzz);
        vec4 bottom = mix(bottomLeft, bottomRight, fracRC.yyzz);
        vec4 newValue = mix(top, bottom, fracRC.x);

        setOutput(newValue);
      }

And also:

webgl_util.ts:107 Uncaught (in promise) Error: Failed to compile fragment shader.
    at kr (webgl_util.ts:107)
    at t.createProgram (gpgpu_context.ts:281)
    at gpgpu_math.ts:84
    at gpgpu_math.ts:103
    at t.getAndSaveBinary (backend_webgl.ts:2338)
    at t.compileAndRun (backend_webgl.ts:2299)
    at t.resizeBilinear (backend_webgl.ts:1962)
    at Bt.engine.runKernel.batchImages (image_ops.ts:62)
    at engine.ts:206
    at t.scopedRun (engine.ts:167)
WebGL: CONTEXT_LOST_WEBGL: loseContext: context lost

My code is as follows:

store.get(key).onsuccess = async function (e) {
      var classes = e.target.result.classes;
      var image_size = e.target.result.image_size;
      model = await tf.loadLayersModel(IDB_URL + key);

      // TODO: Allow the users to decide below params.
      const logits = tf.tidy(() => {
        console.log('start itt');
      // tf.browser.fromPixels() returns a Tensor from an image element.
        const img = tf.browser.fromPixels(imgData).toFloat();
        const img2 = tf.image.resizeBilinear(img, [image_size, image_size])
        console.log('img resized')
        const offset = tf.scalar(127.5);
        // Normalize the image from [0, 255] to [-1, 1].
        const normalized = img2.sub(offset).div(offset);
        console.log('image ready')
        // Reshape to a single-element batch so we can pass it to predict.
        const batched = normalized.reshape([image_size, image_size, 3]);
        batched.expandDims().print(true);

        // Make a prediction through mobilenet.
        console.log('off to predictions');
        return model.predict(batched.expandDims());
      });

      const predictions = await getTopKClasses(logits, classes, 1);
      console.log(predictions);

      self.hideProgress();

      // Show the classes in the DOM.
      self.showResults(predictions[0].className + " - " + predictions[0].probability);
    }

[arthare]

This may not be what is breaking you since I can’t see the same busted code I was getting.

But in my case I had done a tensor slice that resulted in it having a non-integer shape. In my case, I had a 668.25 x 1-shaped tensor. I assume those sizes eventually get carried to the fragment shader that Tensorflow builds, and having a non-integer texture size is clearly not supported.

[rthadur]

This question is better asked on StackOverflow since it is not a bug or feature request. There is also a larger community that reads questions there.