Improve sw versioning, try flags with stage

Author: microbit-robert

src/Makefile

@@ -146,8 +146,8 @@ $(BUILD)/micropython.js: $(OBJ) jshal.js simulator-js
 	$(Q)emcc $(LDFLAGS) -o $(BUILD)/firmware.js $(OBJ) $(JSFLAGS)
 
 simulator-js:
-	npx esbuild ./simulator.ts --bundle --outfile=$(BUILD)/simulator.js --loader:.svg=text
-	npx esbuild --define:process.env.version=$$(cat ../package.json | jq .version) ./sw.ts --bundle --outfile=$(BUILD)/sw.js
+	npx esbuild '--define:process.env.STAGE="$(STAGE)"' ./simulator.ts --bundle --outfile=$(BUILD)/simulator.js --loader:.svg=text
+	npx esbuild --define:process.env.VERSION=$$(npm pkg get version) ./sw.ts --bundle --outfile=$(BUILD)/sw.js
 
 include $(TOP)/py/mkrules.mk
 

src/environment.ts

@@ -0,0 +1,3 @@
+export type Stage = "local" | "REVIEW" | "STAGING" | "PRODUCTION";
+
+export const stage = (process.env.STAGE || "local") as Stage;

src/flags.ts

@@ -0,0 +1,56 @@
+import { Stage, stage as stageFromEnvironment } from "./environment";
+
+/**
+ * A union of the flag names (alphabetical order).
+ */
+export type Flag =
+  /**
+   * Enables service worker registration.
+   *
+   * Registers the service worker and enables offline use.
+   */
+  "sw";
+
+interface FlagMetadata {
+  defaultOnStages: Stage[];
+  name: Flag;
+}
+
+const allFlags: FlagMetadata[] = [{ name: "sw", defaultOnStages: [] }];
+
+type Flags = Record<Flag, boolean>;
+
+const flagsForParams = (stage: Stage, params: URLSearchParams) => {
+  const enableFlags = new Set(params.getAll("flag"));
+  const allFlagsDefault = enableFlags.has("none")
+    ? false
+    : enableFlags.has("*")
+    ? true
+    : undefined;
+  return Object.fromEntries(
+    allFlags.map((f) => [
+      f.name,
+      isEnabled(f, stage, allFlagsDefault, enableFlags.has(f.name)),
+    ])
+  ) as Flags;
+};
+
+const isEnabled = (
+  f: FlagMetadata,
+  stage: Stage,
+  allFlagsDefault: boolean | undefined,
+  thisFlagOn: boolean
+): boolean => {
+  if (thisFlagOn) {
+    return true;
+  }
+  if (allFlagsDefault !== undefined) {
+    return allFlagsDefault;
+  }
+  return f.defaultOnStages.includes(stage);
+};
+
+export const flags: Flags = (() => {
+  const params = new URLSearchParams(window.location.search);
+  return flagsForParams(stageFromEnvironment, params);
+})();

src/simulator.ts

@@ -7,6 +7,7 @@ import {
   createMessageListener,
   Notifications,
 } from "./board";
+import { flags } from "./flags";
 
 declare global {
   interface Window {
@@ -48,7 +49,9 @@ function initServiceWorker() {
   });
 }
 
-initServiceWorker();
+if (flags.sw) {
+  initServiceWorker();
+}
 const fs = new FileSystem();
 const board = createBoard(new Notifications(window.parent), fs);
 window.addEventListener("message", createMessageListener(board));

src/sw.ts

@@ -5,7 +5,7 @@ declare const self: ServiceWorkerGlobalScope;
 declare const clients: Clients;
 
 const assets = ["simulator.html", "build/simulator.js", "build/firmware.js"];
-const cacheName = `simulator-${process.env.version}`;
+const cacheName = `simulator-${process.env.VERSION}`;
 
 self.addEventListener("install", (event) => {
   console.log("Installing simulator service worker...");