orphic-cypress
Version:
Set of utilities and typescript transformers to cover storybook stories with cypress component tests
130 lines • 5.61 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.transformIsolatedComponentFiles = void 0;
/**
* @module transformers
*/
const ts = __importStar(require("typescript"));
/** becomes `import { executeCyTests } from "orphic-cypress"` */
const createImportStatement = (factory, opts, executeCyTestsLocation) => {
// handle commonjs module type as chosen in tsconfig.json
if (opts.module === ts.ModuleKind.CommonJS) {
return factory.createVariableStatement(
/* modifiers */ undefined, factory.createVariableDeclarationList([
factory.createVariableDeclaration("executeCyTests",
/* exclamation token */ undefined,
/* type */ undefined, factory.createPropertyAccessExpression(factory.createCallExpression(factory.createIdentifier("require"),
/* type arguments */ undefined, [factory.createStringLiteral(executeCyTestsLocation)]), factory.createIdentifier("executeCyTests"))),
]));
}
return factory.createImportDeclaration(
/* modifiers */ undefined, factory.createImportClause(
/* isTypeOnly */ false,
/* name (so default import) */ undefined, factory.createNamedImports([
factory.createImportSpecifier(
/* isTypeOnly */ false,
/* name (would mean `export { executeCyTests as })`) */ undefined, factory.createIdentifier("executeCyTests")),
])), factory.createStringLiteral(executeCyTestsLocation));
};
/**
* Transform a typescript stories file by adding `executeCyTests` to the bottom
* with all exports explicitly passed in and the default recreated to be passed
* in as 'default' prop.
*
* In webpack, can use with ts-loader like so
* ```ts
* {
* test: /\.[jt]sx?$/,
* exclude: [/node_modules/],
* use: [
* {
* loader: "ts-loader",
* options: {
* happyPackMode: true,
* transpileOnly: true,
* ...(useIsolatedComponentFiles && {
* getCustomTransformers: () => ({
* before: [transformIsolatedComponentFiles()],
* }),
* }),
* },
* },
* ],
* }
* ```
*
* To include mdx files as tests, add this to module rules
* ```ts
* {
* test: /\.mdx$/,
* use: [
* <above ts-loader config>,
* {
* loader: require.resolve("@storybook/mdx1-csf/loader"),
* options: { skipCsf },
* },
* ],
* },
* ```
* see {@link bundlers.cypressWebpackConfigMdx} for an abstraction to do just that,
* as well as load non-story mdx and md files.
*/
const transformIsolatedComponentFiles = (
/**
* Location for `executeCyTests`. Defaults to this module, but you could import it elsewhere
* and change via pre/post call, or rewrite entirely and point to it from here
*/
executeCyTestsLocation = "orphic-cypress",
/** story filename pattern */
storyPattern = /\.stories|story\./) => (context) => (source) => {
var _a, _b, _c, _d;
const exports = (_b = (_a = source.symbol) === null || _a === void 0 ? void 0 : _a.exports) !== null && _b !== void 0 ? _b : new Map();
const defaultExport = (_d = (_c = exports.get("default")) === null || _c === void 0 ? void 0 : _c.declarations) === null || _d === void 0 ? void 0 : _d[0];
const matches = source.fileName &&
(storyPattern instanceof RegExp
? storyPattern.test(source.fileName)
: source.fileName.includes(storyPattern));
// docs only stories will have a ___page which intentionally throws an error
if (!matches || !exports || exports.has("___page") || !defaultExport) {
return source;
}
const exportKeys = [...exports.keys()].filter((name) => name !== "default");
if (!exportKeys.length)
return source;
const { factory: f, getCompilerOptions } = context;
const opts = getCompilerOptions();
const newImport = createImportStatement(f, opts, executeCyTestsLocation);
const newExportObject = f.createObjectLiteralExpression([
f.createPropertyAssignment("default", defaultExport.expression),
...exportKeys.map((k) => f.createShorthandPropertyAssignment(k)),
]);
/** becomes `executeCyCall({ default: {<default export obj>}, OtherStory, <...> })` */
const executeCyCall = f.createCallExpression(f.createIdentifier("executeCyTests"), [], [newExportObject]);
const allStatements = [newImport, ...source.statements, executeCyCall];
return f.updateSourceFile(source, allStatements);
};
exports.transformIsolatedComponentFiles = transformIsolatedComponentFiles;
//# sourceMappingURL=isolated-component-files.js.map