@cedarjs/testing 0.1.1 → 0.1.2-next.95

package/config/jest/api/jest.setup.js

@@ -4,7 +4,7 @@
 // @NOTE without these imports in the setup file, mockCurrentUser
 // will remain undefined in the user's tests
 // Remember to use specific imports
-const { defineScenario } = require('@cedarjs/testing/dist/api/scenario')
+const { defineScenario } = require('@cedarjs/testing/dist/cjs/api/scenario')
 
 // @NOTE we do this because jest.setup.js runs every time in each context
 // while jest-preset runs once. This significantly reduces memory footprint, and testing time

package/config/jest/babelPlugins/__tests__/__fixtures__/cell/cell-with-commented-exports/code.js

@@ -0,0 +1,28 @@
+export const QUERY = gql`
+  query {
+    posts {
+      id
+      title
+      body
+    }
+  }
+`
+
+// export const beforeQuery = () => ({})
+export const afterQuery = () => ({})
+
+export function Loading() {
+  return 'Loading'
+}
+
+// export function Empty() {
+//   return 'Empty'
+// }
+
+export function Failure({ error }) {
+  return error.message
+}
+
+export const Success = ({ posts }) => {
+  return JSON.stringify(posts, null, 2)
+}

package/config/jest/babelPlugins/__tests__/__fixtures__/cell/cell-with-commented-exports/output.js

@@ -0,0 +1,35 @@
+import { createCell } from '@cedarjs/web'
+export const QUERY = gql`
+  query {
+    posts {
+      id
+      title
+      body
+    }
+  }
+`
+
+// export const beforeQuery = () => ({})
+export const afterQuery = () => ({})
+export function Loading() {
+  return 'Loading'
+}
+
+// export function Empty() {
+//   return 'Empty'
+// }
+
+export function Failure({ error }) {
+  return error.message
+}
+export const Success = ({ posts }) => {
+  return JSON.stringify(posts, null, 2)
+}
+export default createCell({
+  QUERY,
+  afterQuery,
+  Loading,
+  Failure,
+  Success,
+  displayName: 'code',
+})

package/config/jest/babelPlugins/__tests__/__fixtures__/cell/cell-with-default-and-other-named-export/code.js

@@ -0,0 +1,7 @@
+export const Success = () => {
+  return 'string'
+}
+
+export default () => {
+  return 'string'
+}

package/config/jest/babelPlugins/__tests__/__fixtures__/cell/cell-with-default-and-other-named-export/output.js

@@ -0,0 +1,6 @@
+export const Success = () => {
+  return 'string'
+}
+export default () => {
+  return 'string'
+}

package/config/jest/babelPlugins/__tests__/__fixtures__/cell/cell-with-default-export/code.js

@@ -0,0 +1,3 @@
+export default () => {
+  return 'string'
+}

package/config/jest/babelPlugins/__tests__/__fixtures__/cell/cell-with-default-export/output.js

@@ -0,0 +1,3 @@
+export default () => {
+  return 'string'
+}

package/config/jest/babelPlugins/__tests__/__fixtures__/cell/cell-with-required-exports/code.js

@@ -0,0 +1,28 @@
+export const QUERY = gql`
+  query {
+    posts {
+      id
+      title
+      body
+    }
+  }
+`
+
+export const beforeQuery = () => ({})
+export const afterQuery = () => ({})
+
+export function Loading() {
+  return 'Loading'
+}
+
+export function Empty() {
+  return 'Empty'
+}
+
+export function Failure({ error }) {
+  return error.message
+}
+
+export const Success = ({ posts }) => {
+  return JSON.stringify(posts, null, 2)
+}

package/config/jest/babelPlugins/__tests__/__fixtures__/cell/cell-with-required-exports/output.js

@@ -0,0 +1,34 @@
+import { createCell } from '@cedarjs/web'
+export const QUERY = gql`
+  query {
+    posts {
+      id
+      title
+      body
+    }
+  }
+`
+export const beforeQuery = () => ({})
+export const afterQuery = () => ({})
+export function Loading() {
+  return 'Loading'
+}
+export function Empty() {
+  return 'Empty'
+}
+export function Failure({ error }) {
+  return error.message
+}
+export const Success = ({ posts }) => {
+  return JSON.stringify(posts, null, 2)
+}
+export default createCell({
+  QUERY,
+  beforeQuery,
+  afterQuery,
+  Loading,
+  Empty,
+  Failure,
+  Success,
+  displayName: 'code',
+})

package/config/jest/babelPlugins/__tests__/__fixtures__/viteDistDir/client-build-manifest.json

@@ -0,0 +1,59 @@
+{
+  "components/Post/Posts/image1.jpg": {
+    "file": "assets/image1-hash.jpg",
+    "src": "components/Post/Posts/image1.jpg"
+  },
+  "index.css": {
+    "file": "assets/index-3f5e7a04.css",
+    "src": "index.css"
+  },
+  "index.html": {
+    "assets": [
+      "assets/image1-hash.jpg",
+      "assets/image2-hash.jpeg",
+      "assets/image3-hash.png",
+      "assets/image4-hash.bmp",
+      "assets/doc-hash.pdf",
+      "assets/funny-hash.gif"
+    ],
+    "css": [
+      "assets/index-3f5e7a04.css"
+    ],
+    "dynamicImports": [
+      "pages/AboutPage/AboutPage.tsx",
+      "pages/BlogPostPage/BlogPostPage.tsx",
+      "pages/ContactUsPage/ContactUsPage.tsx",
+      "pages/DoublePage/DoublePage.tsx",
+      "pages/ForgotPasswordPage/ForgotPasswordPage.tsx",
+      "pages/Post/PostPage/PostPage.tsx",
+      "pages/Post/PostsPage/PostsPage.tsx"
+    ],
+    "file": "assets/index-abef5d50.js",
+    "isEntry": true,
+    "src": "index.html"
+  },
+  "pages/HomePage/image1.jpg": {
+    "file": "assets/image1-hash.jpg",
+    "src": "components/Post/Posts/image1.jpg"
+  },
+  "pages/HomePage/image2.jpeg": {
+    "file": "assets/image2-hash.jpeg",
+    "src": "pages/HomePage/image2.jpeg"
+  },
+  "pages/HomePage/image3.png": {
+    "file": "assets/image3-hash.png",
+    "src": "pages/HomePage/image3.png"
+  },
+  "pages/HomePage/image4.bmp": {
+    "file": "assets/image4-hash.bmp",
+    "src": "pages/HomePage/image4.bmp"
+  },
+  "pages/HomePage/funny.gif": {
+    "file": "assets/funny-hash.gif",
+    "src": "pages/HomePage/funny.gif"
+  },
+  "pdf/invoice.pdf": {
+    "file": "assets/invoice-7d64ed28.pdf",
+    "src": "pdf/invoice.pdf"
+  }
+}

package/config/jest/babelPlugins/__tests__/babel-plugin-redwood-cell.test.ts

@@ -0,0 +1,11 @@
+import path from 'path'
+
+import pluginTester from 'babel-plugin-tester'
+
+import redwoodCellPlugin from '../babel-plugin-redwood-cell'
+
+pluginTester({
+  plugin: redwoodCellPlugin,
+  pluginName: 'babel-plugin-redwood-cell',
+  fixtures: path.join(__dirname, '__fixtures__/cell'),
+})

package/config/jest/babelPlugins/babel-plugin-redwood-cell.js

@@ -0,0 +1,142 @@
+const { parse } = require('path')
+
+// This wraps a file that has a suffix of `Cell` in Redwood's `createCell` higher
+// order component. The HOC deals with the lifecycle methods during a GraphQL query.
+//
+// ```js
+// import { createCell } from '@cedarjs/web'
+// <YOUR CODE>
+// export default createCell({ QUERY, Loading, Success, Failure, isEmpty, Empty, beforeQuery, afterQuery, displayName })
+// ```
+//
+// To debug the output of the plugin, you can use the following:
+// ```
+// import generate from '@babel/generator'
+// // ...
+// console.log(generate(path.node).code)
+// ```
+
+// A cell can export the declarations below.
+const EXPECTED_EXPORTS_FROM_CELL = [
+  'beforeQuery',
+  'QUERY',
+  'data',
+  'isEmpty',
+  'afterQuery',
+  'Loading',
+  'Success',
+  'Failure',
+  'Empty',
+]
+
+module.exports = function ({ types: t }) {
+  // This array will collect exports from the Cell file during
+  // ExportNamedDeclaration
+  // - collected exports will then be passed to `createCell`
+  // - The array is reset every time we `enter` a new Program
+  let exportNames = []
+  let hasDefaultExport = false
+
+  return {
+    name: 'babel-plugin-redwood-cell',
+    visitor: {
+      ExportDefaultDeclaration() {
+        hasDefaultExport = true
+      },
+      ExportNamedDeclaration(path) {
+        const declaration = path.node.declaration
+
+        if (!declaration) {
+          return
+        }
+
+        let name
+        if (declaration.type === 'VariableDeclaration') {
+          const id = declaration.declarations[0].id
+          name = id.name
+        }
+        if (declaration.type === 'FunctionDeclaration') {
+          name = declaration?.id?.name
+        }
+
+        if (name && EXPECTED_EXPORTS_FROM_CELL.includes(name)) {
+          exportNames.push(name)
+        }
+      },
+      Program: {
+        enter() {
+          // Reset variables as they're still in scope from the previous file
+          // babel transformed in the same process
+          exportNames = []
+          hasDefaultExport = false
+        },
+        exit(path) {
+          const hasQueryOrDataExport =
+            exportNames.includes('QUERY') || exportNames.includes('data')
+
+          // If the file already has a default export then
+          //   1. It's likely not a cell, or it's a cell that's already been
+          //      wrapped in `createCell`
+          //   2. If we added another default export we'd be breaking JS module
+          //      rules. There can only be one default export.
+          // If there's no `QUERY` or `data` export it's not a valid cell
+          if (hasDefaultExport || !hasQueryOrDataExport) {
+            return
+          }
+
+          // TODO (RSC): When we want to support `data = async () => {}` in
+          // client cells as well, we'll need a different heuristic here
+          // If we want to support `QUERY` (gql) cells on the server we'll
+          // also need a different heuristic
+          const createCellHookName = exportNames.includes('data')
+            ? 'createServerCell'
+            : 'createCell'
+          const importFrom = exportNames.includes('data')
+            ? '@cedarjs/web/dist/components/cell/createServerCell'
+            : '@cedarjs/web'
+
+          // Insert at the top of the file:
+          // + import { createCell } from '@cedarjs/web'
+          path.node.body.unshift(
+            t.importDeclaration(
+              [
+                t.importSpecifier(
+                  t.identifier(createCellHookName),
+                  t.identifier(createCellHookName),
+                ),
+              ],
+              t.stringLiteral(importFrom),
+            ),
+          )
+
+          // Insert at the bottom of the file:
+          // + export default createCell({ QUERY?, Loading?, Success?, Failure?, Empty?, beforeQuery?, isEmpty, afterQuery?, displayName? })
+          path.node.body.push(
+            t.exportDefaultDeclaration(
+              t.callExpression(t.identifier(createCellHookName), [
+                t.objectExpression([
+                  ...exportNames.map((name) =>
+                    t.objectProperty(
+                      t.identifier(name),
+                      t.identifier(name),
+                      false,
+                      true,
+                    ),
+                  ),
+                  // Add the `displayName` property so we can name the Cell
+                  // after the filename.
+                  t.objectProperty(
+                    t.identifier('displayName'),
+                    t.stringLiteral(parse(this.file.opts.filename).name),
+                    false,
+                    true,
+                  ),
+                ]),
+              ]),
+            ),
+          )
+        },
+      },
+    },
+  }
+}

package/config/jest/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "commonjs"
+}

package/config/jest/web/jest-preset.js

@@ -52,7 +52,7 @@ module.exports = {
     // We replace imports to "@cedarjs/router" with our own "mock" implementation.
     '^@cedarjs/router$': path.join(
       NODE_MODULES_PATH,
-      '@cedarjs/testing/dist/web/MockRouter.js',
+      '@cedarjs/testing/dist/cjs/web/MockRouter.js',
     ),
     '^@cedarjs/web$': path.join(NODE_MODULES_PATH, '@cedarjs/web/dist/cjs'),
 
@@ -60,7 +60,7 @@ module.exports = {
     // clients, which in turn lets us mock `useAuth` in tests
     '^@cedarjs/auth$': path.join(
       NODE_MODULES_PATH,
-      '@cedarjs/testing/dist/web/mockAuth.js',
+      '@cedarjs/testing/dist/cjs/web/mockAuth.js',
     ),
 
     // @NOTE: Import @cedarjs/testing in web tests, and it automatically remaps to the web side only

package/config/jest/web/jest.setup.js

@@ -3,7 +3,7 @@
 require('@testing-library/jest-dom')
 require('whatwg-fetch')
 
-const { findCellMocks } = require('@cedarjs/testing/dist/web/findCellMocks')
+const { findCellMocks } = require('@cedarjs/testing/dist/cjs/web/findCellMocks')
 const {
   startMSW,
   setupRequestHandlers,
@@ -11,7 +11,7 @@ const {
   mockGraphQLMutation,
   mockGraphQLQuery,
   mockCurrentUser,
-} = require('@cedarjs/testing/dist/web/mockRequests')
+} = require('@cedarjs/testing/dist/cjs/web/mockRequests')
 
 global.mockGraphQLQuery = mockGraphQLQuery
 global.mockGraphQLMutation = mockGraphQLMutation

package/config/jest/web/webBabelConfig.js

@@ -1,3 +1,18 @@
 const { getWebSideDefaultBabelConfig } = require('@cedarjs/babel-config')
 
-module.exports = getWebSideDefaultBabelConfig({ forJest: true })
+const redwoodCellsPlugin = require('../babelPlugins/babel-plugin-redwood-cell')
+
+const defaultWebSideBabelConfig = getWebSideDefaultBabelConfig({
+  forJest: true,
+})
+
+module.exports = {
+  ...defaultWebSideBabelConfig,
+  overrides: [
+    ...defaultWebSideBabelConfig.overrides,
+    {
+      test: /.+Cell.(js|tsx|jsx)$/,
+      plugins: [redwoodCellsPlugin],
+    },
+  ],
+}

package/dist/api/apiFunction.js

@@ -1,29 +1,4 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var apiFunction_exports = {};
-__export(apiFunction_exports, {
-  mockContext: () => mockContext,
-  mockHttpEvent: () => mockHttpEvent,
-  mockSignedWebhook: () => mockSignedWebhook
-});
-module.exports = __toCommonJS(apiFunction_exports);
-var import_webhooks = require("@cedarjs/api/webhooks");
+import { signPayload } from "@cedarjs/api/webhooks";
 const mockHttpEvent = ({
   payload = null,
   signature,
@@ -70,7 +45,7 @@ const mockSignedWebhook = ({
   ...others
 }) => {
   const payloadAsString = typeof payload === "string" ? payload : JSON.stringify(payload);
-  const signature = (0, import_webhooks.signPayload)(signatureType, {
+  const signature = signPayload(signatureType, {
     payload: payloadAsString,
     secret
   });
@@ -81,9 +56,8 @@ const mockSignedWebhook = ({
     ...others
   });
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
+export {
   mockContext,
   mockHttpEvent,
   mockSignedWebhook
-});
+};

package/dist/api/directUrlHelpers.js

@@ -1,40 +1,6 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var directUrlHelpers_exports = {};
-__export(directUrlHelpers_exports, {
-  checkAndReplaceDirectUrl: () => checkAndReplaceDirectUrl,
-  getDefaultDb: () => getDefaultDb
-});
-module.exports = __toCommonJS(directUrlHelpers_exports);
-var import_path = __toESM(require("path"));
+import path from "path";
 function getDefaultDb(rwjsCwd) {
-  return `file:${import_path.default.join(rwjsCwd, ".redwood", "test.db")}`;
+  return `file:${path.join(rwjsCwd, ".redwood", "test.db")}`;
 }
 function checkAndReplaceDirectUrl(prismaSchema, defaultDb) {
   const directUrl = prismaSchema.match(PRISMA_DIRECT_URL_REGEXP);
@@ -53,8 +19,7 @@ function checkAndReplaceDirectUrl(prismaSchema, defaultDb) {
 }
 const PRISMA_DIRECT_URL_REGEXP = /directUrl(\s*)=(\s*)env\(('|")(.*)('|")\)/g;
 const BETWEEN_PARENTHESES_REGEXP = /\(('|")([^)]+)('|")\)/;
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
+export {
   checkAndReplaceDirectUrl,
   getDefaultDb
-});
+};

package/dist/api/directive.js

@@ -1,49 +1,25 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var directive_exports = {};
-__export(directive_exports, {
-  getDirectiveName: () => import_graphql_server2.getDirectiveName,
-  mockRedwoodDirective: () => mockRedwoodDirective
-});
-module.exports = __toCommonJS(directive_exports);
-var import_context = require("@cedarjs/context");
-var import_graphql_server = require("@cedarjs/graphql-server");
-var import_graphql_server2 = require("@cedarjs/graphql-server");
+import { setContext, context as globalContext } from "@cedarjs/context";
+import { DirectiveType } from "@cedarjs/graphql-server";
+import { getDirectiveName } from "@cedarjs/graphql-server";
 const mockRedwoodDirective = (directive, executionMock) => {
   const { directiveArgs, context, ...others } = executionMock;
   if (directive.onResolvedValue.constructor.name === "AsyncFunction") {
     return async () => {
       if (context !== void 0) {
-        (0, import_context.setContext)(context);
+        setContext(context);
       }
-      if (directive.type === import_graphql_server.DirectiveType.TRANSFORMER) {
+      if (directive.type === DirectiveType.TRANSFORMER) {
         const { mockedResolvedValue } = others;
         return directive.onResolvedValue({
           resolvedValue: mockedResolvedValue,
           directiveArgs: directiveArgs ?? {},
-          context: import_context.context,
+          context: globalContext,
           ...others
         });
       } else {
         await directive.onResolvedValue({
           directiveArgs: directiveArgs ?? {},
-          context: import_context.context,
+          context: globalContext,
           ...others
         });
       }
@@ -51,27 +27,26 @@ const mockRedwoodDirective = (directive, executionMock) => {
   }
   return () => {
     if (context !== void 0) {
-      (0, import_context.setContext)(context);
+      setContext(context);
     }
-    if (directive.type === import_graphql_server.DirectiveType.TRANSFORMER) {
+    if (directive.type === DirectiveType.TRANSFORMER) {
       const { mockedResolvedValue } = others;
       return directive.onResolvedValue({
         resolvedValue: mockedResolvedValue,
         directiveArgs: directiveArgs ?? {},
-        context: import_context.context,
+        context: globalContext,
         ...others
       });
     } else {
       directive.onResolvedValue({
         directiveArgs: directiveArgs ?? {},
-        context: import_context.context,
+        context: globalContext,
         ...others
       });
     }
   };
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
+export {
   getDirectiveName,
   mockRedwoodDirective
-});
+};

package/dist/api/index.d.ts

@@ -1,4 +1,4 @@
-export * from './apiFunction';
-export * from './scenario';
-export * from './directive';
+export * from './apiFunction.js';
+export * from './scenario.js';
+export * from './directive.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/api/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/api/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAA;AAC7B,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/api/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAA;AAChC,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA"}