Update nb_test

Author: qti3e

src/app.tsx

@@ -52,6 +52,11 @@ function bind(C, bindProps: BindProps) {
   return class extends Component<any, BindState> {
     state = { data: null, error: null };
     prevMatches = null;
+    componentRef;
+
+    private onReady() {
+      if (this.props.onReady) this.props.onReady();
+    }
 
     async loadData() {
       if (equal(this.props.matches, this.prevMatches)) return;
@@ -74,7 +79,8 @@ function bind(C, bindProps: BindProps) {
       const { data, error } = this.state;
       if (error) return <ErrorPage message={error} />;
       if (!data) return <Loading />;
-      return <C {...this.props} {...data} />;
+      this.onReady();
+      return <C ref={r => (this.componentRef = r)} {...this.props} {...data} />;
     }
   };
 }

src/nb_test.ts

@@ -1,24 +1,13 @@
 import { h, render, rerender } from "preact";
 import { testBrowser } from "../tools/tester";
+import { NotebookPage, ProfilePage } from "./app";
 import { cellExecuteQueue } from "./components/cell";
 import { Notebook } from "./components/notebook";
 import * as db from "./db";
-import * as nb from "./notebook_root";
 import { assert, assertEqual, createResolvable, delay } from "./util";
 
 const DOC_TITLE = "Anonymous Notebook";
 
-testBrowser(async function notebook_NotebookRoot() {
-  const mdb = db.enableMock();
-  resetPage();
-  const el = h(nb.NotebookRoot, {});
-  render(el, document.body);
-  await flush();
-  assertEqual(mdb.counts, { queryLatest: 1 });
-  const c = document.body.getElementsByTagName("div")[0];
-  assertEqual(c.className, "notebook");
-});
-
 testBrowser(async function notebook_Notebook() {
   const mdb = db.enableMock();
   await renderAnonNotebook();
@@ -126,21 +115,21 @@ testBrowser(async function notebook_profile() {
   await renderProfile("non-existant");
   let avatars = document.querySelectorAll(".avatar");
   assert(avatars.length === 0);
-  let notebooks = document.querySelectorAll(".most-recent ol li");
+  let notebooks = document.querySelectorAll(".nb-listing ol li");
   assert(notebooks.length === 0);
   assertEqual(mdb.counts, { queryProfile: 1 });
 
   // Try again with a real uid.
   await renderProfile(db.defaultOwner.uid);
   avatars = document.querySelectorAll(".avatar");
   assert(avatars.length === 1);
-  notebooks = document.querySelectorAll(".most-recent ol li");
+  notebooks = document.querySelectorAll(".nb-listing ol li");
   assert(notebooks.length === 1);
   assertEqual(mdb.counts, { queryProfile: 2 });
 });
 
 testBrowser(async function notebook_executeQueue() {
-  const { notebookRef } = await renderAnonNotebook();
+  const notebookRef = await renderAnonNotebook();
   // All the cells must be executed now.
   assertEqual(cellExecuteQueue.length, 0);
   const cell1 = await notebookRef.insertCell(2, "a = 0");
@@ -163,7 +152,7 @@ testBrowser(async function notebook_executeQueue() {
 
 testBrowser(async function notebook_urlImport() {
   db.enableMock();
-  const { notebookRef } = await renderAnonNotebook();
+  const notebookRef = await renderAnonNotebook();
   const testdataUrl = `${location.origin}/repo/src/testdata`;
 
   const cell1 = await notebookRef.insertCell(
@@ -202,27 +191,32 @@ function resetPage() {
 function renderProfile(profileUid: string) {
   const promise = createResolvable();
   resetPage();
-  const el = h(nb.NotebookRoot, {
-    onReady: promise.resolve,
-    profileUid
+  const el = h(ProfilePage, {
+    matches: {
+      userId: profileUid
+    },
+    onReady: promise.resolve
   });
   render(el, document.body);
   return promise;
 }
 
-async function renderAnonNotebook(): Promise<nb.NotebookRoot> {
+async function renderAnonNotebook(): Promise<Notebook> {
   const promise = createResolvable();
   resetPage();
-  let notebookRoot: nb.NotebookRoot;
-  const el = h(nb.NotebookRoot, {
-    nbId: "default",
+  let notebookRoot;
+  const el = h(NotebookPage, {
+    matches: {
+      nbId: "default"
+    },
     onReady: promise.resolve,
-    ref: n => (notebookRoot = n)
+    ref: ref => (notebookRoot = ref)
   });
   render(el, document.body);
   await promise;
-  await notebookRoot.notebookRef.isReady;
-  return notebookRoot;
+  const notebookRef = notebookRoot.componentRef;
+  await notebookRef.isReady;
+  return notebookRef;
 }
 
 async function renderNotebook(): Promise<Notebook> {