brut-js 0.0.1 → 0.0.4

package/package.json

@@ -1,12 +1,16 @@
 {
   "name": "brut-js",
-  "version": "0.0.1",
+  "version": "0.0.4",
   "type": "module",
   "keywords": [ "WebComponents", "Custom Elements" ],
   "bugs": {
     "url": "https://github.com/thirdtank/brut-js/issues",
     "email": "davec@naildrivin5.com"
   },
+  "exports": {
+    ".": "./src/index.js",
+    "./testing": "./src/testing/index.js"
+  },
   "repository": "https://github.com/thirdtank/brut-js",
   "author": {
     "name": "David Copeland",

package/specs/AjaxSubmit.spec.js

@@ -1,4 +1,4 @@
-import { withHTML, readRequestBodyIntoString, waitForSetTimeout } from "../src/testing/index.js"
+import { withHTML } from "./SpecHelper.js"
 
 describe("<brut-ajax-submit>", () => {
   withHTML(`
@@ -12,7 +12,9 @@ describe("<brut-ajax-submit>", () => {
   `).onFetch( "/foo", [
     { then: { status: 200 }},
   ]
-  ).test("submits the form, setting various attributes during the lifecycle", ({document,assert,fetchRequests}) => {
+  ).test("submits the form, setting various attributes during the lifecycle", 
+         ({document,assert,fetchRequests,waitForSetTimeout,readRequestBodyIntoString}) => {
+
     const element = document.querySelector("brut-ajax-submit")
     const button  = element.querySelector("button")
     const text    = document.querySelector("input[name=some-text]")
@@ -80,7 +82,8 @@ describe("<brut-ajax-submit>", () => {
     { then: { status: 500 }},
     { then: { status: 200 }},
   ]
-  ).test("submits the form after a retry", ({document,assert,fetchRequests}) => {
+  ).test("submits the form after a retry",
+        ({document,assert,fetchRequests,waitForSetTimeout,readRequestBodyIntoString}) => {
     const element = document.querySelector("brut-ajax-submit")
     const button  = element.querySelector("button")
     const text    = document.querySelector("input[name=some-text]")
@@ -124,7 +127,7 @@ describe("<brut-ajax-submit>", () => {
     { then: { status: 500 }},
     { then: { status: 500 }},
   ]
-  ).test("when too many failures, submits the form the old-fashioned way", ({document,assert,fetchRequests}) => {
+  ).test("when too many failures, submits the form the old-fashioned way", ({document,assert,fetchRequests, waitForSetTimeout}) => {
     const form    = document.querySelector("form")
     const element = form.querySelector("brut-ajax-submit")
     const button  = element.querySelector("button")
@@ -195,7 +198,7 @@ Error that should be ignored
       }
     },
   ]
-  ).test("when we get a 422, parses the result from the server", ({document,window,assert,fetchRequests}) => {
+  ).test("when we get a 422, parses the result from the server", ({document,window,assert,fetchRequests,waitForSetTimeout}) => {
     const form    = document.querySelector("form")
     const element = form.querySelector("brut-ajax-submit")
     const button  = element.querySelector("button")

package/specs/Autosubmit.spec.js

@@ -1,4 +1,4 @@
-import { withHTML } from "../src/testing/index.js"
+import { withHTML } from "./SpecHelper.js"
 
 describe("<brut-autosubmit>", () => {
   withHTML(`

package/specs/ConfirmSubmit.spec.js

@@ -1,4 +1,4 @@
-import { withHTML } from "../src/testing/index.js"
+import { withHTML } from "./SpecHelper.js"
 
 describe("<brut-confirm-submit>", () => {
   describe("without an explicit dialog", () => {

package/specs/ConstraintViolationMessage.spec.js

@@ -1,4 +1,4 @@
-import { withHTML } from "../src/testing/index.js"
+import { withHTML } from "./SpecHelper.js"
 
 describe("<brut-constraint-violation-message>", () => {
   withHTML(`

package/specs/ConstraintViolationMessages.spec.js

@@ -1,4 +1,4 @@
-import { withHTML } from "../src/testing/index.js"
+import { withHTML } from "./SpecHelper.js"
 
 describe("<brut-constraint-violation-messages>", () => {
   withHTML(`

package/specs/Form.spec.js

@@ -1,4 +1,4 @@
-import { withHTML } from "../src/testing/index.js"
+import { withHTML } from "./SpecHelper.js"
 
 describe("<brut-form>", () => {
   withHTML(`

package/specs/I18nTranslation.spec.js

@@ -1,4 +1,4 @@
-import { withHTML } from "../src/testing/index.js"
+import { withHTML } from "./SpecHelper.js"
 
 describe("<brut-i18n-translation>", () => {
   withHTML(`

package/specs/LocaleDetection.spec.js

@@ -1,4 +1,4 @@
-import { withHTML, readRequestBodyIntoJSON } from "../src/testing/index.js"
+import { withHTML } from "./SpecHelper.js"
 
 describe("<brut-locale-detection>", () => {
   withHTML(`
@@ -6,7 +6,7 @@ describe("<brut-locale-detection>", () => {
   `).onFetch( "/locale", [
     { then: { status: 200 }},
   ]
-  ).test("Receives the locale and timeZone from the browser", ({document,assert,fetchRequests}) => {
+  ).test("Receives the locale and timeZone from the browser", ({document,assert,fetchRequests,readRequestBodyIntoJSON}) => {
 
     assert.equal(1,fetchRequests.length)
     return readRequestBodyIntoJSON(fetchRequests[0]).then( (json) => {

package/specs/Message.spec.js

@@ -1,4 +1,4 @@
-import { withHTML } from "../src/testing/index.js"
+import { withHTML } from "./SpecHelper.js"
 
 describe("<brut-message>", () => {
   withHTML(`

package/specs/SpecHelper.js

@@ -0,0 +1,23 @@
+import { createTestBasedOnHTML } from "../src/testing/index.js"
+
+import path from "node:path"
+import fs from "node:fs"
+
+const __dirname = import.meta.dirname
+
+const appRoot = path.resolve(__dirname)
+const publicRoot = path.resolve(appRoot,"public")
+const assetMetadataFilePath = path.resolve(appRoot,"config","asset_metadata.json")
+const assetMetadata = JSON.parse(fs.readFileSync(assetMetadataFilePath))
+
+const withHTML = (html) => {
+  return createTestBasedOnHTML({
+    html,
+    assetMetadata,
+    publicRoot
+  })
+}
+
+export {
+  withHTML,
+}

package/specs/Tabs.spec.js

@@ -1,4 +1,4 @@
-import { withHTML } from "../src/testing/index.js"
+import { withHTML } from "./SpecHelper.js"
 
 describe("<brut-tabs>", () => {
   withHTML(`

package/src/testing/AssetMetadata.js

@@ -0,0 +1,35 @@
+import fs from "node:fs"
+import path from "node:path"
+/**
+ * Provides structured access to the asset metadata for a BrutRB app. This is used to allow custom elements
+ * to be defined in JSDOM the same way they are in a real browser.
+ *
+ * @memberof testing
+ */
+class AssetMetadata {
+  constructor(parsedJSON, publicRoot) {
+    this.assetMetadata = parsedJSON.asset_metadata
+    this.publicRoot    = publicRoot
+  }
+
+  scriptURLs() {
+    return Object.entries(this.assetMetadata[".js"]).map( (entry) => {
+      return entry[0] 
+    })
+  }
+
+  fileContainingScriptURL(scriptURL) {
+    const file = Object.entries(this.assetMetadata[".js"]).find( (entry) => {
+      return entry[0] == scriptURL
+    })
+    if (!file || !file[1]) {
+      return null
+    }
+    let relativePath = file[1]
+    if (relativePath[0] == "/") {
+      relativePath = relativePath.slice(1)
+    }
+    return fs.readFileSync(path.resolve(this.publicRoot,relativePath))
+  }
+}
+export default AssetMetadata

package/src/testing/AssetMetadataLoader.js

@@ -0,0 +1,25 @@
+import { ResourceLoader } from "jsdom"
+
+/**
+ * An JSDOM resource loader based on BrutRB asset metadata.
+ *
+ * @memberof testing
+ */
+class AssetMetadataLoader extends ResourceLoader {
+  constructor(assetMetadata) {
+    super()
+    this.assetMetadata = assetMetadata
+  }
+
+  fetch(url,options) {
+    const parsedURL = new URL(url)
+    const jsContents = this.assetMetadata.fileContainingScriptURL(parsedURL.pathname)
+    if (jsContents) {
+      return Promise.resolve(jsContents)
+    }
+    else {
+      return super.fetch(url,options)
+    }
+  }
+}
+export default AssetMetadataLoader

package/src/testing/CustomElementTest.js

@@ -0,0 +1,235 @@
+import DOMCreator from "./DOMCreator.js"
+import assert from "assert"
+/**
+ * The class that implements a test case.  Typically, an instance of this is created for you and you call `test` on that to write your
+ * test case.
+ * @memberof testing
+ */
+class CustomElementTest {
+  constructor(html, queryString, assetMetadata) {
+    this.html          = html
+    this.queryString   = queryString
+    this.fetchBehavior = {}
+    this.assetMetadata = assetMetadata
+  }
+
+  /**
+   * Configure a query string to be present when the custom elements are defined and connected.
+   */
+  andQueryString(queryString) {
+    this.queryString = queryString
+    return this
+  }
+
+  /**
+   * Configure behavior when #{link external:fetch} is called, since it's not implemented by JSDom or NodeJS.
+   *
+   * @param {String} url - the URL that is expected. This should be a relative URL, as that is all that is currently supported. This
+   * URL must match exactly to a `fetch` call.
+   * @param {Object} behavior - an object describing what you want to happen when `url` is fetched.  This currently supports only a
+   * few rudimentary behaviors:
+   * * `{then: { ok: { text: "some text" } } }` - This will return an "ok" response whose body is the given text, available only as
+   * text.
+   * * `{then: { status: XXX, text: "some text" }}` - This will return the given http status, with `ok` as true if it's 2xx or 3xx. If `text` is given, that will be available as text only.
+   */
+  onFetch(url,behavior) {
+    if (!this.fetchBehavior[url]) {
+      this.fetchBehavior[url] = {
+        numCalls: 0,
+        responses: [],
+      }
+    }
+    if (behavior instanceof Array) {
+      behavior.forEach( (b) =>  {
+        this.fetchBehavior[url].responses.push(b)
+      })
+    }
+    else {
+      this.fetchBehavior[url].responses.push(behavior)
+    }
+    return this
+  }
+
+  /** Comment out a test without using code comments */
+  xtest() {
+    return this
+  }
+
+
+  /** Declare a test to run with the previously-defined HTML, query string, and fetch behavior.
+   *
+   * @param {String} description - a description of the test.
+   * @param {testCodeCallback} testCode - a function containing the code for your test.
+   */
+  test(description,testCode) {
+    it(description, () => {
+      const domCreator = new DOMCreator(this.assetMetadata)
+      const dom = domCreator.create({
+        html: this.html,
+        queryString: this.queryString
+      })
+      const fetchRequests = []
+
+      dom.window.Request = Request
+      dom.window.fetch = (request) => {
+        const url = new URL(request.url)
+        const path = url.pathname + url.search
+        const behaviors = this.fetchBehavior[path]
+        if (!behaviors) {
+          throw `fetch() called with ${path}, which was not configured`
+        }
+        if (behaviors.numCalls > behaviors.responses.length) {
+          throw `fetch() called ${behaviors.numCalls} times, but we only have ${behaviors.response.length} responses configured`
+        }
+        const behavior = behaviors.responses[behaviors.numCalls]
+        behaviors.numCalls++
+
+        let promise = null
+
+        if (behavior.then) {
+          if (behavior.then.ok) {
+            if (behavior.then.ok.text) {
+              const response = {
+                ok: true,
+                text: () => {
+                  return Promise.resolve(behavior.then.ok.text)
+                }
+              }
+              promise = Promise.resolve(response)
+            }
+            else {
+              throw `unknown fetch behavior: expected then.ok.text: ${JSON.stringify(behavior)}`
+            }
+          }
+          else if (behavior.then.status) {
+            let ok = false
+            if ((behavior.then.status >= 200) && (behavior.then.status < 400) ){
+              ok = true
+            }
+            const response = {
+              ok: ok,
+              status: behavior.then.status,
+                text: () => {
+                  return Promise.resolve(behavior.then.text)
+                }
+            }
+            promise = Promise.resolve(response)
+          }
+          else {
+            throw `unknown fetch behavior: expected then.ok or then.status: ${JSON.stringify(behavior)}`
+          }
+        }
+        else {
+          throw `unknown fetch behavior: expected then: ${JSON.stringify(behavior)}`
+        }
+        request.promiseReturned = promise
+        fetchRequests.push(request)
+        return promise
+      }
+
+      const window = dom.window
+      const document = window.document
+      let returnValue = null
+      return new Promise( (resolve, reject) => {
+        dom.window.addEventListener("load", () => {
+          try {
+            const paramsGivenToTest = {
+              window,
+              document,
+              assert,
+              fetchRequests,
+              waitForSetTimeout: this.#waitForSetTimeout,
+              readRequestBodyIntoJSON: this.#readRequestBodyIntoJSON,
+              readRequestBodyIntoString: this.#readRequestBodyIntoString,
+            }
+            returnValue = testCode(paramsGivenToTest)
+            if (returnValue) {
+              resolve(returnValue)
+            }
+            else {
+              resolve()
+            }
+          } catch (e) {
+            reject(e)
+          }
+        })
+      })
+    })
+    return this
+  }
+
+  /** Used to wait for a few milliseconds before performing further assertions.
+   * This can be useful when a custom element has `setTimeout` calls
+   */
+  #waitForSetTimeout = (ms) => {
+    return new Promise( (resolve) => {
+      setTimeout(resolve,ms)
+    })
+  }
+
+  /**
+   * Given a fetch request (available via `fetchRequests` passed to your test), turn the body into JSON
+   * and return a promise with the JSON.  To use this in a test, you must include your assertions inside
+   * the `then` of the returned promise and you *must* return that from your test.
+   *
+   * @example
+   * withHTML(
+   *   "<div-makes-a-fetch>"
+   * ).onFetch("/foo", { then: { status: 200 }}
+   * ).test("a test",({assert,fetchRequests}) => {
+   *   assert.equal(fetchRequests.length,1)
+   *   return readRequestBodyIntoJSON(fetchRequests[0]).then( (json) => {
+   *     assert.equal(json["foo"],"bar")
+   *   })
+   * })
+   */
+  #readRequestBodyIntoJSON = (request) => {
+    return this.#readRequestBodyIntoString(request).then( (string) => {
+      try {
+        const json = JSON.parse(string)
+        return Promise.resolve(json)
+      }
+      catch (e) {
+        assert(false,`'${string}' could not be parsed as JSON`)
+      }
+      return Promise.resolve()
+    })
+  }
+
+  /**
+   * Given a fetch request (available via `fetchRequests` passed to your test), turn the body into a string
+   * and return a promise with the string.  To use this in a test, you must include your assertions inside
+   * the `then` of the returned promise and you *must* return that from your test.
+   *
+   * @example
+   * withHTML(
+   *   "<div-makes-a-fetch>"
+   * ).onFetch("/foo", { then: { status: 200 }}
+   * ).test("a test",({assert,fetchRequests}) => {
+   *   assert.equal(fetchRequests.length,1)
+   *   return readRequestBodyIntoString(fetchRequests[0]).then( (string) => {
+   *     assert.equal(string,"foo")
+   *   })
+   * })
+   */
+  #readRequestBodyIntoString = (request) => {
+    const reader = request.body.getReader()
+    const utf8Decoder = new TextDecoder("utf-8");
+    let string = ""
+    const parse = ({value,done}) => {
+      if (done) {
+        return Promise.resolve(string)
+      }
+      else {
+        if (value) {
+          string = string + utf8Decoder.decode(value, { stream: true })
+        }
+        return reader.read().then(parse)
+      }
+    }
+    return reader.read().then(parse)
+  }
+
+
+}
+export default CustomElementTest

package/src/testing/DOMCreator.js

@@ -0,0 +1,45 @@
+import { JSDOM, VirtualConsole } from "jsdom"
+
+import AssetMetadataLoader from "./AssetMetadataLoader.js"
+
+/**
+ * Creates a JSDOM based on the the given HTML and query string.
+ *
+ * @memberof testing
+ */
+class DOMCreator {
+  constructor(assetMetadata) {
+    this.assetMetadata = assetMetadata
+  }
+
+  create({html,queryString}) {
+
+    const resourceLoader = new AssetMetadataLoader(this.assetMetadata)
+
+
+    const url = "http://example.com" + ( queryString ? `?${queryString}` : "" )
+
+    const scripts = this.assetMetadata.scriptURLs().map( (url) => `<script src="${url}"></script>` )
+    const virtualConsole = new VirtualConsole()
+    virtualConsole.sendTo(console);
+    return new JSDOM(
+      `<!DOCTYPE html>
+        <html>
+        <head>
+        ${scripts}
+        </head>
+        <body>
+        ${html}
+        </body>
+        </html>
+        `,{
+          resources: "usable",
+          runScripts: "dangerously",
+          includeNodeLocations: true,
+          resources: resourceLoader,
+          url: url
+        }
+    )
+  }
+}
+export default DOMCreator

package/src/testing/index.js

@@ -21,328 +21,28 @@
  *
  * @module testing
  */
-import { JSDOM, ResourceLoader, VirtualConsole } from "jsdom"
-import fs from "node:fs"
-import path from "node:path"
-import assert from "assert"
-
-const __dirname = import.meta.dirname
-
-const appRoot = path.resolve(__dirname,"..","..","specs")
-const publicRoot = path.resolve(appRoot,"public")
-
-class AssetMetadata {
-  constructor(parsedJSON, publicRoot) {
-    this.assetMetadata = parsedJSON.asset_metadata
-    this.publicRoot    = publicRoot
-  }
-
-  scriptURLs() {
-    return Object.entries(this.assetMetadata[".js"]).map( (entry) => {
-      return entry[0] 
-    })
-  }
-
-  fileContainingScriptURL(scriptURL) {
-    const file = Object.entries(this.assetMetadata[".js"]).find( (entry) => {
-      return entry[0] == scriptURL
-    })
-    if (!file || !file[1]) {
-      return null
-    }
-    let relativePath = file[1]
-    if (relativePath[0] == "/") {
-      relativePath = relativePath.slice(1)
-    }
-    return fs.readFileSync(path.resolve(this.publicRoot,relativePath))
-  }
-}
-
-const assetMetadata = new AssetMetadata(
-  JSON.parse(fs.readFileSync(path.resolve(appRoot,"config","asset_metadata.json"))),
-  publicRoot,
-)
-
-class AssetMetadataLoader extends ResourceLoader {
-  constructor(assetMetadata) {
-    super()
-    this.assetMetadata = assetMetadata
-  }
-
-  fetch(url,options) {
-    const parsedURL = new URL(url)
-    const jsContents = this.assetMetadata.fileContainingScriptURL(parsedURL.pathname)
-    if (jsContents) {
-      return Promise.resolve(jsContents)
-    }
-    else {
-      return super.fetch(url,options)
-    }
-  }
-}
-
-const resourceLoader = new AssetMetadataLoader(assetMetadata)
-
-const createDOM = (html, queryString) => {
-
-  const url = "http://example.com" + ( queryString ? `?${queryString}` : "" )
-
-  const scripts = assetMetadata.scriptURLs().map( (url) => `<script src="${url}"></script>` )
-  const virtualConsole = new VirtualConsole()
-  virtualConsole.sendTo(console);
-  return new JSDOM(
-    `<!DOCTYPE html>
-        <html>
-        <head>
-        ${scripts}
-        </head>
-        <body>
-        ${html}
-        </body>
-        </html>
-        `,{
-          resources: "usable",
-          runScripts: "dangerously",
-          includeNodeLocations: true,
-          resources: resourceLoader,
-          url: url
-        }
-  )
-}
-
-/**
- * Returned by {@link withHTML} as the basis for writing tests for custom elements. You won't create
- * instances of this class. Rather, you'll be given an instance from `withHTML` and likely call
- * `test` on it.
- *
- * @see withHTML
- */
-class CustomElementTest {
-  constructor(html, queryString) {
-    this.html          = html
-    this.queryString   = queryString
-    this.fetchBehavior = {}
-  }
-
-  /**
-   * Configure a query string to be present when the custom elements are defined and connected.
-   */
-  andQueryString(queryString) {
-    this.queryString = queryString
-    return this
-  }
-
-  /**
-   * Configure behavior when #{link external:fetch} is called, since it's not implemented by JSDom or NodeJS.
-   *
-   * @param {String} url - the URL that is expected. This should be a relative URL, as that is all that is currently supported. This
-   * URL must match exactly to a `fetch` call.
-   * @param {Object} behavior - an object describing what you want to happen when `url` is fetched.  This currently supports only a
-   * few rudimentary behaviors:
-   * * `{then: { ok: { text: "some text" } } }` - This will return an "ok" response whose body is the given text, available only as
-   * text.
-   * * `{then: { status: XXX, text: "some text" }}` - This will return the given http status, with `ok` as true if it's 2xx or 3xx. If `text` is given, that will be available as text only.
-   */
-  onFetch(url,behavior) {
-    if (!this.fetchBehavior[url]) {
-      this.fetchBehavior[url] = {
-        numCalls: 0,
-        responses: [],
-      }
-    }
-    if (behavior instanceof Array) {
-      behavior.forEach( (b) =>  {
-        this.fetchBehavior[url].responses.push(b)
-      })
-    }
-    else {
-      this.fetchBehavior[url].responses.push(behavior)
-    }
-    return this
-  }
-
-  /** Comment out a test without using code comments */
-  xtest() {
-    return this
-  }
-
-
-  /** Declare a test to run with the previously-defined HTML, query string, and fetch behavior.
-   *
-   * @param {String} description - a description of the test.
-   * @param {testCodeCallback} testCode - a function containing the code for your test.
-   */
-  test(description,testCode) {
-    it(description, () => {
-      const dom = createDOM(this.html,this.queryString)
-      const fetchRequests = []
-
-      dom.window.Request = Request
-      dom.window.fetch = (request) => {
-        const url = new URL(request.url)
-        const path = url.pathname + url.search
-        const behaviors = this.fetchBehavior[path]
-        if (!behaviors) {
-          throw `fetch() called with ${path}, which was not configured`
-        }
-        if (behaviors.numCalls > behaviors.responses.length) {
-          throw `fetch() called ${behaviors.numCalls} times, but we only have ${behaviors.response.length} responses configured`
-        }
-        const behavior = behaviors.responses[behaviors.numCalls]
-        behaviors.numCalls++
-
-        let promise = null
-
-        if (behavior.then) {
-          if (behavior.then.ok) {
-            if (behavior.then.ok.text) {
-              const response = {
-                ok: true,
-                text: () => {
-                  return Promise.resolve(behavior.then.ok.text)
-                }
-              }
-              promise = Promise.resolve(response)
-            }
-            else {
-              throw `unknown fetch behavior: expected then.ok.text: ${JSON.stringify(behavior)}`
-            }
-          }
-          else if (behavior.then.status) {
-            let ok = false
-            if ((behavior.then.status >= 200) && (behavior.then.status < 400) ){
-              ok = true
-            }
-            const response = {
-              ok: ok,
-              status: behavior.then.status,
-                text: () => {
-                  return Promise.resolve(behavior.then.text)
-                }
-            }
-            promise = Promise.resolve(response)
-          }
-          else {
-            throw `unknown fetch behavior: expected then.ok or then.status: ${JSON.stringify(behavior)}`
-          }
-        }
-        else {
-          throw `unknown fetch behavior: expected then: ${JSON.stringify(behavior)}`
-        }
-        request.promiseReturned = promise
-        fetchRequests.push(request)
-        return promise
-      }
-
-      const window = dom.window
-      const document = window.document
-      let returnValue = null
-      return new Promise( (resolve, reject) => {
-        dom.window.addEventListener("load", () => {
-          try {
-            returnValue = testCode({window,document,assert,fetchRequests})
-            if (returnValue) {
-              resolve(returnValue)
-            }
-            else {
-              resolve()
-            }
-          } catch (e) {
-            reject(e)
-          }
-        })
-      })
-    })
-    return this
-  }
-}
+import AssetMetadata from "./AssetMetadata.js"
+import CustomElementTest from "./CustomElementTest.js"
 
 /**
- * Sets up the HTML in which a test will be run.  This allows you to configure what HTML will be "served"
- * by JSDOM before any custom elements are defined or connected.
+ * Bootstraps a test based on some HTML and configuration about where the bundled custom elements are. It's recommended that you
+ * create the method `withHTML` in your `SpecHelper.js` file to set up the asset metadata stuff.
  *
  * This returns a {@link module:testing~CustomElementTest}, on which you can call additional setup methods, or start defining tests with the 
  * {@link module:testing~CustomElementTest#test} method.
  *
- * @see module:testing~CustomElementTest
- */
-const withHTML = (html) => new CustomElementTest(html)
-
-/**
- * Given a fetch request (available via `fetchRequests` passed to your test), turn the body into JSON
- * and return a promise with the JSON.  To use this in a test, you must include your assertions inside
- * the `then` of the returned promise and you *must* return that from your test.
- *
- * @example
- * withHTML(
- *   "<div-makes-a-fetch>"
- * ).onFetch("/foo", { then: { status: 200 }}
- * ).test("a test",({assert,fetchRequests}) => {
- *   assert.equal(fetchRequests.length,1)
- *   return readRequestBodyIntoJSON(fetchRequests[0]).then( (json) => {
- *     assert.equal(json["foo"],"bar")
- *   })
- * })
- */
-const readRequestBodyIntoJSON = (request) => {
-  return readRequestBodyIntoString(request).then( (string) => {
-    try {
-      const json = JSON.parse(string)
-      return Promise.resolve(json)
-    }
-    catch (e) {
-      assert(false,`'${string}' could not be parsed as JSON`)
-    }
-    return Promise.resolve()
-  })
-}
-
-/**
- * Given a fetch request (available via `fetchRequests` passed to your test), turn the body into a string
- * and return a promise with the string.  To use this in a test, you must include your assertions inside
- * the `then` of the returned promise and you *must* return that from your test.
+ * @param {String} html - HTML that should be in the document for the test
+ * @param {Object} assetMetadata - a JSON object describing where the bundles are.  This is needed to allow JSDOM to load the custom
+ * elements as if it were served up by a webserver
+ * @param {String} publicRoot - The root to where JS files.  When using this in a BrutRB web app, this would be where your bundled
+ * files are placed for serving.
  *
- * @example
- * withHTML(
- *   "<div-makes-a-fetch>"
- * ).onFetch("/foo", { then: { status: 200 }}
- * ).test("a test",({assert,fetchRequests}) => {
- *   assert.equal(fetchRequests.length,1)
- *   return readRequestBodyIntoString(fetchRequests[0]).then( (string) => {
- *     assert.equal(string,"foo")
- *   })
- * })
- */
-const readRequestBodyIntoString = (request) => {
-  const reader = request.body.getReader()
-  const utf8Decoder = new TextDecoder("utf-8");
-  let string = ""
-  const parse = ({value,done}) => {
-    if (done) {
-      return Promise.resolve(string)
-    }
-    else {
-      if (value) {
-        string = string + utf8Decoder.decode(value, { stream: true })
-      }
-      return reader.read().then(parse)
-    }
-  }
-  return reader.read().then(parse)
-}
-
-/** Used to wait for a few milliseconds before performing further assertions.
- * This can be useful when a custom element has `setTimeout` calls
+ * @see module:testing~CustomElementTest
  */
-const waitForSetTimeout = (ms) => {
-  return new Promise( (resolve) => {
-    setTimeout(resolve,ms)
-  })
+const createTestBasedOnHTML = ({html,assetMetadata,publicRoot}) => {
+  return new CustomElementTest(html,null,new AssetMetadata(assetMetadata,publicRoot))
 }
 
 export {
-  withHTML,
-  readRequestBodyIntoJSON,
-  readRequestBodyIntoString,
-  waitForSetTimeout,
+  createTestBasedOnHTML
 }

package/.projections.json

@@ -1,10 +0,0 @@
-{
-  "src/*.js": {
-    "alternate": "specs/{}.spec.js",
-    "type": "source"
-  },
-  "specs/*.spec.js": {
-    "alternate": "src/{}.js",
-    "type": "spec"
-  }
-}