webgl не создаётся шейдер

function initwebgl(canvas) {
  const context = canvas.getContext("webgl2") ||
    canvas.getContext("webgl") ||
    canvas.getContext("experimental-webgl");
  if (!context) {
    alert('У вас не поддерживается webgl, используйте новый Google Chrome');
  }
  return context;
}

function createShader(gl, type, source) {
  const shader = gl.createShader(type);
  console.log(shader);
  gl.shaderSource(shader, source);
  gl.compileShader(shader);
  const sucess = gl.getShaderParameter(shader, gl.COMPILE_STATUS);
  if (sucess) {
    return shader;
  }

  console.log(gl.getShaderInfoLog(shader));
  gl.deleteShader(shader);
}

function createProgram(gl, v, f) {
  const program = gl.createProgram();
  gl.attachShader(program, v);
  gl.attachShader(program, f);
  gl.linkProgram(program);
  const sucess = gl.getProgramParameter(program, gl.LINK_STATUS);
  if (sucess) {
    return program;
  }

  console.log(gl.getProgramInfoLog(program));
  gl.deleteProgram(program);
}

function drawWebglCanvas(f, v, gl) {
  const vertexShader = createShader(gl, gl.VERTEX_SHADER, v);
  const fragmentShader = createShader(gl, gl.FRAGMENT_SHADER, f);
  const program = createProgram(gl, vertexShader, fragmentShader);
  const positionAttributeLocation = gl.getAttribLocation(program, 'a_position');
  const positionBuffer = gl.createBuffer();
  gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
}

const fragment = document.querySelector('#fragment').innerHTML;
const vertex = document.querySelector('#vertex').innerHTML;
const canvas = document.querySelector('#glcanvas');
const gl = initwebgl(canvas);
if (gl) {
  drawWebglCanvas(fragment, vertex, gl);
}

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body,
html {
  position: relative;
  width: 100%;
  height: 100%;
}

#glcanvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

<canvas id="glcanvas">

<script type="notjs" id="vertex">
attribute vec4 a_position;
void main() {
    gl_Position = a_position;
}
</script>

<script type="notjs" id="fragment">
precision mediump float;

void main(){
    gl_FragColor = vec4(1, 0, 0.5, 1); 
}
</script>