fix: reset id counter on cleanup (#5)

src/__tests__/fixtures/scoped-id.marko

@@ -0,0 +1 @@
+<div role="main" id:scoped="test"/>

src/__tests__/fixtures/scoped-id.marko.d.ts

@@ -0,0 +1,2 @@
+declare let x: any;
+export = x;

src/__tests__/render.browser.ts

@@ -6,6 +6,7 @@ import UpdateCounter from "./fixtures/update-counter.marko";
 import HelloWorld from "./fixtures/hello-world.marko";
 import HelloName from "./fixtures/hello-name.marko";
 import Clickable from "./fixtures/clickable.marko";
+import ScopedId from "./fixtures/scoped-id.marko";
 
 afterEach(cleanup);
 
@@ -143,3 +144,11 @@ test("fireEvent waits for pending updates", async () => {
 
   expect(getByText("Value: 1")).toBeInTheDocument();
 });
+
+test("it renders a stable scoped id", async () => {
+  const r1 = await render(ScopedId);
+  expect(r1.getByRole("main")).toHaveProperty("id", "c0-test");
+  cleanup();
+  const r2 = await render(ScopedId);
+  expect(r2.getByRole("main")).toHaveProperty("id", "c0-test");
+});

src/index-browser.ts

@@ -118,6 +118,7 @@ export async function render<T extends Template>(
 
 export function cleanup() {
   mountedComponents.forEach(destroyComponent);
+  resetComponentIdCounter();
 }
 
 function destroyComponent(component) {
@@ -132,3 +133,11 @@ function destroyComponent(component) {
 
   mountedComponents.delete(container);
 }
+
+function resetComponentIdCounter() {
+  const counter = (window as any).$MUID;
+  /* istanbul ignore else */
+  if (counter) {
+    counter.i = 0;
+  }
+}