add version message

README.md

@@ -178,3 +178,28 @@ worked (build and look at the page). Of particular note, check that angle bracke
 
 For other languages you'll likely need to copy the English file and translate.
 
+## Browser Version Issues
+
+WebGPU version 1 has been getting minor updates with cooperation from all browsers. Chrome shipped
+WebGPU in May of 2023 in Chrome 113. As of January 2024, no other browser has shipped WebGPU although
+both Safari and Firefox have versions in progress and available in
+[Safari Technology Preview](https://developer.apple.com/safari/technology-preview/)
+and [Firefox Nightly](https://www.mozilla.org/en-US/firefox/channel/desktop/#nightly).
+
+In any case, with the consultation of all the major browser vendors, small features have been
+added to the version 1 spec. These include but are not limited to:
+
+* Support for `HTMLImageElement` with `copyExternalImageToTexture`
+
+  In the initial shipment of WebGPU, `HTMLImageElement` was not supported so this site used `ImageBitmap`
+  which was supported. Using `HTMLImageElement` is more familiar to developers so this site switched
+  to using `HTMLImageElement`.
+
+* Default entry points to shader modules
+
+  In the initial shipment of WebGPU you were require to specify an `entryPoint: 'nameOfFunction'`
+  when creating a pipeline. It was later agreed that if there was only one entry point of a particular
+  type in a shader module, then you didn't need to specify an entry point.
+
+  It seems pretty clear this no entry point specified way will be the idiomatic way to use WebGPU
+  going forward so this site switched to not using entry points.

webgpu/resources/lessons-helper.js

@@ -506,6 +506,52 @@ function installAlertCatcher() {
   };
 }
 
+async function checkVersion() {
+  console.log('here');
+  const adapter = await navigator.gpu?.requestAdapter();
+  const device = await adapter?.requestDevice();
+  if (!device) {
+    return;  // samples already handle no WebGPU
+  }
+  // check for no entryPoint support
+  device.pushErrorScope('validation');
+  const module = device.createShaderModule({
+    code: `
+    @compute @workgroup_size(1) fn cs() {};
+    `,
+  });
+  try {
+    device.createComputePipeline({ layout: 'auto', compute: { module } });
+  } catch (e) {
+    const msg = document.createElement('div');
+    msg.textContent = 'You need Chrome version 121 or later';
+    const a = document.createElement('a');
+    a.textContent = '[why?]';
+    a.target = '_blank';
+    a.href = 'https://github.com/webgpu/webgpufundamentals#browser-version-issues';
+    a.style = 'color: yellow';
+    const elem = document.createElement('div');
+    elem.style = `
+      position: fixed;
+      display: flex;
+      flex-direction: column;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100vh;
+      color: white;
+      background-color: red;
+      justify-content: center;
+      align-items: center;
+    `;
+    elem.appendChild(msg);
+    elem.appendChild(a);
+    document.body.appendChild(elem);
+  } finally {
+    device.destroy();
+  }
+}
+
 function installWebGPULessonSetup() {
   /*
   const isWebGLRE = /^(webgl|webgl2|experimental-webgl)$/i;
@@ -548,6 +594,7 @@ function installWebGPUDebugHelper() {
   }
 }
 
+checkVersion();
 installWebGPULessonSetup();
 
 if (isInEditor()) {