Debug THREE.js shaders in JavaScript

debugShader.js

//debugging shaders

const getBufferItems = buffer => Array.from({ length: buffer.count }, (_, i) =>
  Array.from({ length: buffer.itemSize }, (_, j) =>
    buffer.array[i * buffer.itemSize + j]))

// declare uniforms (INSERT HERE)
const { v1, v2, v3 } = Object.fromEntries(Object.entries(mesh.material.uniforms).map(([k, v]) => [k, v.value]))

// declare shader functions
const clamp = (x, min, max) => Math.min(Math.max(x, min), max)
const float = x => x
const step = (edge, x) => x < edge ? 0 : 1

// run shader code
getBufferItems(mesh.geometry.attributes.position).map((position, gl_VertexID) => {
  // shader code (INSERT HERE)
})