@storybook/angular 9.1.0-alpha.5 → 9.1.0-alpha.7

package/start-schema.json

@@ -0,0 +1,234 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "title": "Start Storybook",
+  "description": "Serve up storybook in development mode.",
+  "type": "object",
+  "properties": {
+    "browserTarget": {
+      "type": "string",
+      "description": "Build target to be served in project-name:builder:config format. Should generally target on the builder: '@angular-devkit/build-angular:browser'. Useful for Storybook to use options (styles, assets, ...).",
+      "pattern": "^[^:\\s]+:[^:\\s]+(:[^\\s]+)?$"
+    },
+    "debugWebpack": {
+      "type": "boolean",
+      "description": "Debug the Webpack configuration",
+      "default": false
+    },
+    "tsConfig": {
+      "type": "string",
+      "description": "The full path for the TypeScript configuration file, relative to the current workspace."
+    },
+    "preserveSymlinks": {
+      "type": "boolean",
+      "description": "Do not use the real path when resolving modules. If true, symlinks are resolved to their real path, if false, symlinks are resolved to their symlinked path.",
+      "default": false
+    },
+    "port": {
+      "type": "number",
+      "description": "Port to listen on.",
+      "default": 9009
+    },
+    "host": {
+      "type": "string",
+      "description": "Host to listen on.",
+      "default": "localhost"
+    },
+    "configDir": {
+      "type": "string",
+      "description": "Directory where to load Storybook configurations from.",
+      "default": ".storybook"
+    },
+    "https": {
+      "type": "boolean",
+      "description": "Serve Storybook over HTTPS. Note: You must provide your own certificate information.",
+      "default": false
+    },
+    "sslCa": {
+      "type": "string",
+      "description": "Provide an SSL certificate authority. (Optional with --https, required if using a self-signed certificate)."
+    },
+    "sslCert": {
+      "type": "string",
+      "description": "Provide an SSL certificate. (Required with --https)."
+    },
+    "sslKey": {
+      "type": "string",
+      "description": "SSL key to use for serving HTTPS."
+    },
+    "smokeTest": {
+      "type": "boolean",
+      "description": "Exit after successful start.",
+      "default": false
+    },
+    "ci": {
+      "type": "boolean",
+      "description": "CI mode (skip interactive prompts, don't open browser).",
+      "default": false
+    },
+    "open": {
+      "type": "boolean",
+      "description": "Whether to open Storybook automatically in the browser.",
+      "default": true
+    },
+    "quiet": {
+      "type": "boolean",
+      "description": "Suppress verbose build output.",
+      "default": false
+    },
+    "enableProdMode": {
+      "type": "boolean",
+      "description": "Disable Angular's development mode, which turns off assertions and other checks within the framework.",
+      "default": false
+    },
+    "docs": {
+      "type": "boolean",
+      "description": "Starts Storybook in documentation mode. Learn more about it : https://storybook.js.org/docs/writing-docs/build-documentation#preview-storybooks-documentation.",
+      "default": false
+    },
+    "compodoc": {
+      "type": "boolean",
+      "description": "Execute compodoc before.",
+      "default": true
+    },
+    "compodocArgs": {
+      "type": "array",
+      "description": "Compodoc options : https://compodoc.app/guides/options.html. Options `-p` with tsconfig path and `-d` with workspace root is always given.",
+      "default": ["-e", "json"],
+      "items": {
+        "type": "string"
+      }
+    },
+    "styles": {
+      "type": "array",
+      "description": "Global styles to be included in the build.",
+      "items": {
+        "$ref": "#/definitions/styleElement"
+      }
+    },
+    "stylePreprocessorOptions": {
+      "description": "Options to pass to style preprocessors.",
+      "type": "object",
+      "properties": {
+        "includePaths": {
+          "description": "Paths to include. Paths will be resolved to workspace root.",
+          "type": "array",
+          "items": {
+            "type": "string"
+          }
+        }
+      },
+      "additionalProperties": false
+    },
+    "assets": {
+      "type": "array",
+      "description": "List of static application assets.",
+      "default": [],
+      "items": {
+        "$ref": "#/definitions/assetPattern"
+      }
+    },
+    "initialPath": {
+      "type": "string",
+      "description": "URL path to be appended when visiting Storybook for the first time"
+    },
+    "webpackStatsJson": {
+      "type": ["boolean", "string"],
+      "description": "Write Webpack Stats JSON to disk",
+      "default": false
+    },
+    "statsJson": {
+      "type": ["boolean", "string"],
+      "description": "Write stats JSON to disk",
+      "default": false
+    },
+    "previewUrl": {
+      "type": "string",
+      "description": "Disables the default storybook preview and lets you use your own"
+    },
+    "loglevel": {
+      "type": "string",
+      "description": "Controls level of logging during build. Can be one of: [silly, verbose, info (default), warn, error, silent].",
+      "pattern": "(silly|verbose|info|warn|silent)"
+    },
+    "sourceMap": {
+      "type": ["boolean", "object"],
+      "description": "Configure sourcemaps. See: https://angular.io/guide/workspace-config#source-map-configuration",
+      "default": false
+    },
+    "experimentalZoneless": {
+      "type": "boolean",
+      "description": "Experimental: Use zoneless change detection.",
+      "default": false
+    }
+  },
+  "additionalProperties": false,
+  "definitions": {
+    "assetPattern": {
+      "oneOf": [
+        {
+          "type": "object",
+          "properties": {
+            "followSymlinks": {
+              "type": "boolean",
+              "default": false,
+              "description": "Allow glob patterns to follow symlink directories. This allows subdirectories of the symlink to be searched."
+            },
+            "glob": {
+              "type": "string",
+              "description": "The pattern to match."
+            },
+            "input": {
+              "type": "string",
+              "description": "The input directory path in which to apply 'glob'. Defaults to the project root."
+            },
+            "ignore": {
+              "description": "An array of globs to ignore.",
+              "type": "array",
+              "items": {
+                "type": "string"
+              }
+            },
+            "output": {
+              "type": "string",
+              "description": "Absolute path within the output."
+            }
+          },
+          "additionalProperties": false,
+          "required": ["glob", "input", "output"]
+        },
+        {
+          "type": "string"
+        }
+      ]
+    },
+    "styleElement": {
+      "oneOf": [
+        {
+          "type": "object",
+          "properties": {
+            "input": {
+              "type": "string",
+              "description": "The file to include."
+            },
+            "bundleName": {
+              "type": "string",
+              "pattern": "^[\\w\\-.]*$",
+              "description": "The bundle name for this extra entry point."
+            },
+            "inject": {
+              "type": "boolean",
+              "description": "If the bundle will be referenced in the HTML file.",
+              "default": true
+            }
+          },
+          "additionalProperties": false,
+          "required": ["input"]
+        },
+        {
+          "type": "string",
+          "description": "The file to include."
+        }
+      ]
+    }
+  }
+}

package/dist/builders/build-storybook/index.d.ts

@@ -1,25 +0,0 @@
-import { CLIOptions } from 'storybook/internal/types';
-import { BuilderOutput, Builder as DevkitBuilder } from '@angular-devkit/architect';
-import { StylePreprocessorOptions } from '@angular-devkit/build-angular';
-import { AssetPattern, SourceMapUnion, StyleElement } from '@angular-devkit/build-angular/src/builders/browser/schema';
-import { JsonObject } from '@angular-devkit/core';
-export type StorybookBuilderOptions = JsonObject & {
-    browserTarget?: string | null;
-    tsConfig?: string;
-    test: boolean;
-    docs: boolean;
-    compodoc: boolean;
-    compodocArgs: string[];
-    enableProdMode?: boolean;
-    styles?: StyleElement[];
-    stylePreprocessorOptions?: StylePreprocessorOptions;
-    preserveSymlinks?: boolean;
-    assets?: AssetPattern[];
-    sourceMap?: SourceMapUnion;
-    experimentalZoneless?: boolean;
-} & Pick<CLIOptions, 'outputDir' | 'configDir' | 'loglevel' | 'quiet' | 'test' | 'webpackStatsJson' | 'statsJson' | 'disableTelemetry' | 'debugWebpack' | 'previewUrl'>;
-export type StorybookBuilderOutput = JsonObject & BuilderOutput & {
-    [key: string]: any;
-};
-declare const _default: DevkitBuilder<StorybookBuilderOptions & JsonObject>;
-export default _default;

package/dist/builders/build-storybook/index.mjs

@@ -1,78 +0,0 @@
-import { getEnvConfig, versions } from 'storybook/internal/common';
-import { buildStaticStandalone, withTelemetry } from 'storybook/internal/core-server';
-import { addToGlobalContext } from 'storybook/internal/telemetry';
-import { createBuilder, targetFromTargetString, } from '@angular-devkit/architect';
-import { findPackageSync } from 'fd-package-json';
-import { sync as findUpSync } from 'find-up';
-import { from, of, throwError } from 'rxjs';
-import { catchError, map, mapTo, switchMap } from 'rxjs/operators';
-import { errorSummary, printErrorDetails } from '../utils/error-handler';
-import { runCompodoc } from '../utils/run-compodoc';
-addToGlobalContext('cliVersion', versions.storybook);
-const commandBuilder = (options, context) => {
-    const builder = from(setup(options, context)).pipe(switchMap(({ tsConfig }) => {
-        const docTSConfig = findUpSync('tsconfig.doc.json', { cwd: options.configDir });
-        const runCompodoc$ = options.compodoc
-            ? runCompodoc({ compodocArgs: options.compodocArgs, tsconfig: docTSConfig ?? tsConfig }, context).pipe(mapTo({ tsConfig }))
-            : of({});
-        return runCompodoc$.pipe(mapTo({ tsConfig }));
-    }), map(({ tsConfig }) => {
-        getEnvConfig(options, {
-            staticDir: 'SBCONFIG_STATIC_DIR',
-            outputDir: 'SBCONFIG_OUTPUT_DIR',
-            configDir: 'SBCONFIG_CONFIG_DIR',
-        });
-        const { browserTarget, stylePreprocessorOptions, styles, configDir, docs, loglevel, test, outputDir, quiet, enableProdMode = true, webpackStatsJson, statsJson, debugWebpack, disableTelemetry, assets, previewUrl, sourceMap = false, preserveSymlinks = false, experimentalZoneless = false, } = options;
-        const standaloneOptions = {
-            packageJson: findPackageSync(__dirname),
-            configDir,
-            ...(docs ? { docs } : {}),
-            loglevel,
-            outputDir,
-            test,
-            quiet,
-            enableProdMode,
-            disableTelemetry,
-            angularBrowserTarget: browserTarget,
-            angularBuilderContext: context,
-            angularBuilderOptions: {
-                ...(stylePreprocessorOptions ? { stylePreprocessorOptions } : {}),
-                ...(styles ? { styles } : {}),
-                ...(assets ? { assets } : {}),
-                sourceMap,
-                preserveSymlinks,
-                experimentalZoneless,
-            },
-            tsConfig,
-            webpackStatsJson,
-            statsJson,
-            debugWebpack,
-            previewUrl,
-        };
-        return standaloneOptions;
-    }), switchMap((standaloneOptions) => runInstance({ ...standaloneOptions, mode: 'static' })), map(() => {
-        return { success: true };
-    }));
-    return builder;
-};
-export default createBuilder(commandBuilder);
-async function setup(options, context) {
-    let browserOptions;
-    let browserTarget;
-    if (options.browserTarget) {
-        browserTarget = targetFromTargetString(options.browserTarget);
-        browserOptions = await context.validateOptions(await context.getTargetOptions(browserTarget), await context.getBuilderNameForTarget(browserTarget));
-    }
-    return {
-        tsConfig: options.tsConfig ??
-            findUpSync('tsconfig.json', { cwd: options.configDir }) ??
-            browserOptions.tsConfig,
-    };
-}
-function runInstance(options) {
-    return from(withTelemetry('build', {
-        cliOptions: options,
-        presetOptions: { ...options, corePresets: [], overridePresets: [] },
-        printError: printErrorDetails,
-    }, () => buildStaticStandalone(options))).pipe(catchError((error) => throwError(errorSummary(error))));
-}

package/dist/builders/build-storybook/index.spec.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/builders/build-storybook/index.spec.js

@@ -1,222 +0,0 @@
-"use strict";
-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 () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-const architect_1 = require("@angular-devkit/architect");
-const testing_1 = require("@angular-devkit/architect/testing");
-const core_1 = require("@angular-devkit/core");
-const path = __importStar(require("node:path"));
-const vitest_1 = require("vitest");
-const buildDevStandaloneMock = vitest_1.vi.fn();
-const buildStaticStandaloneMock = vitest_1.vi.fn();
-const buildMock = {
-    buildDevStandalone: buildDevStandaloneMock,
-    buildStaticStandalone: buildStaticStandaloneMock,
-    withTelemetry: (name, options, fn) => fn(),
-};
-vitest_1.vi.doMock('storybook/internal/core-server', () => buildMock);
-vitest_1.vi.doMock('storybook/internal/common', () => ({
-    JsPackageManagerFactory: {
-        getPackageManager: () => ({
-            runPackageCommand: mockRunScript,
-        }),
-    },
-    getEnvConfig: (options) => options,
-    versions: {
-        storybook: 'x.x.x',
-    },
-}));
-vitest_1.vi.doMock('find-up', () => ({ sync: () => './storybook/tsconfig.ts' }));
-const mockRunScript = vitest_1.vi.fn();
-// Randomly fails on CI. TODO: investigate why
-vitest_1.describe.skip('Build Storybook Builder', () => {
-    let architect;
-    let architectHost;
-    (0, vitest_1.beforeEach)(async () => {
-        const registry = new core_1.schema.CoreSchemaRegistry();
-        registry.addPostTransform(core_1.schema.transforms.addUndefinedDefaults);
-        architectHost = new testing_1.TestingArchitectHost();
-        architect = new architect_1.Architect(architectHost, registry);
-        architectHost.addBuilder('@angular-devkit/build-angular:browser', (0, architect_1.createBuilder)(() => {
-            return { success: true };
-        }));
-        architectHost.addTarget({ project: 'angular-cli', target: 'build-2' }, '@angular-devkit/build-angular:browser', {
-            outputPath: 'dist/angular-cli',
-            index: 'src/index.html',
-            main: 'src/main.ts',
-            polyfills: 'src/polyfills.ts',
-            tsConfig: 'src/tsconfig.app.json',
-            assets: ['src/favicon.ico', 'src/assets'],
-            styles: ['src/styles.css'],
-            scripts: [],
-        });
-        // This will either take a Node package name, or a path to the directory
-        // for the package.json file.
-        await architectHost.addBuilderFromPackage(path.join(__dirname, '../../..'));
-    });
-    (0, vitest_1.beforeEach)(() => {
-        buildStaticStandaloneMock.mockImplementation((_options) => Promise.resolve(_options));
-    });
-    (0, vitest_1.afterEach)(() => {
-        vitest_1.vi.clearAllMocks();
-    });
-    (0, vitest_1.it)('should start storybook with angularBrowserTarget', async () => {
-        const run = await architect.scheduleBuilder('@storybook/angular:build-storybook', {
-            browserTarget: 'angular-cli:build-2',
-            compodoc: false,
-        });
-        const output = await run.result;
-        await run.stop();
-        (0, vitest_1.expect)(output.success).toBeTruthy();
-        (0, vitest_1.expect)(mockRunScript).not.toHaveBeenCalledWith();
-        (0, vitest_1.expect)(buildStaticStandaloneMock).toHaveBeenCalledWith(vitest_1.expect.objectContaining({
-            angularBrowserTarget: 'angular-cli:build-2',
-            angularBuilderContext: vitest_1.expect.any(Object),
-            configDir: '.storybook',
-            loglevel: undefined,
-            quiet: false,
-            disableTelemetry: undefined,
-            outputDir: 'storybook-static',
-            packageJson: vitest_1.expect.any(Object),
-            mode: 'static',
-            tsConfig: './storybook/tsconfig.ts',
-            statsJson: false,
-        }));
-    });
-    (0, vitest_1.it)('should start storybook with tsConfig', async () => {
-        const run = await architect.scheduleBuilder('@storybook/angular:build-storybook', {
-            tsConfig: 'path/to/tsConfig.json',
-            compodoc: false,
-        });
-        const output = await run.result;
-        await run.stop();
-        (0, vitest_1.expect)(output.success).toBeTruthy();
-        (0, vitest_1.expect)(mockRunScript).not.toHaveBeenCalledWith();
-        (0, vitest_1.expect)(buildStaticStandaloneMock).toHaveBeenCalledWith(vitest_1.expect.objectContaining({
-            angularBrowserTarget: null,
-            angularBuilderContext: vitest_1.expect.any(Object),
-            configDir: '.storybook',
-            loglevel: undefined,
-            quiet: false,
-            disableTelemetry: undefined,
-            outputDir: 'storybook-static',
-            packageJson: vitest_1.expect.any(Object),
-            mode: 'static',
-            tsConfig: 'path/to/tsConfig.json',
-            statsJson: false,
-        }));
-    });
-    (0, vitest_1.it)('should build storybook with webpack stats.json', async () => {
-        const run = await architect.scheduleBuilder('@storybook/angular:build-storybook', {
-            tsConfig: 'path/to/tsConfig.json',
-            compodoc: false,
-            statsJson: true,
-        });
-        const output = await run.result;
-        await run.stop();
-        (0, vitest_1.expect)(output.success).toBeTruthy();
-        (0, vitest_1.expect)(mockRunScript).not.toHaveBeenCalledWith();
-        (0, vitest_1.expect)(buildStaticStandaloneMock).toHaveBeenCalledWith(vitest_1.expect.objectContaining({
-            angularBrowserTarget: null,
-            angularBuilderContext: vitest_1.expect.any(Object),
-            configDir: '.storybook',
-            loglevel: undefined,
-            quiet: false,
-            outputDir: 'storybook-static',
-            packageJson: vitest_1.expect.any(Object),
-            mode: 'static',
-            tsConfig: 'path/to/tsConfig.json',
-            statsJson: true,
-        }));
-    });
-    (0, vitest_1.it)('should throw error', async () => {
-        buildStaticStandaloneMock.mockRejectedValue(true);
-        const run = await architect.scheduleBuilder('@storybook/angular:build-storybook', {
-            browserTarget: 'angular-cli:build-2',
-            compodoc: false,
-        });
-        try {
-            await run.result;
-            (0, vitest_1.expect)(false).toEqual('Throw expected');
-        }
-        catch (error) {
-            (0, vitest_1.expect)(error).toEqual('Broken build, fix the error above.\nYou may need to refresh the browser.');
-        }
-    });
-    (0, vitest_1.it)('should run compodoc', async () => {
-        const run = await architect.scheduleBuilder('@storybook/angular:build-storybook', {
-            browserTarget: 'angular-cli:build-2',
-        });
-        const output = await run.result;
-        await run.stop();
-        (0, vitest_1.expect)(output.success).toBeTruthy();
-        (0, vitest_1.expect)(mockRunScript).toHaveBeenCalledWith('compodoc', ['-p', './storybook/tsconfig.ts', '-d', '.', '-e', 'json'], '');
-        (0, vitest_1.expect)(buildStaticStandaloneMock).toHaveBeenCalledWith(vitest_1.expect.objectContaining({
-            angularBrowserTarget: 'angular-cli:build-2',
-            angularBuilderContext: vitest_1.expect.any(Object),
-            configDir: '.storybook',
-            loglevel: undefined,
-            quiet: false,
-            outputDir: 'storybook-static',
-            packageJson: vitest_1.expect.any(Object),
-            mode: 'static',
-            tsConfig: './storybook/tsconfig.ts',
-            statsJson: false,
-        }));
-    });
-    (0, vitest_1.it)('should start storybook with styles options', async () => {
-        const run = await architect.scheduleBuilder('@storybook/angular:build-storybook', {
-            tsConfig: 'path/to/tsConfig.json',
-            compodoc: false,
-            styles: ['style.scss'],
-        });
-        const output = await run.result;
-        await run.stop();
-        (0, vitest_1.expect)(output.success).toBeTruthy();
-        (0, vitest_1.expect)(mockRunScript).not.toHaveBeenCalledWith();
-        (0, vitest_1.expect)(buildStaticStandaloneMock).toHaveBeenCalledWith(vitest_1.expect.objectContaining({
-            angularBrowserTarget: null,
-            angularBuilderContext: vitest_1.expect.any(Object),
-            angularBuilderOptions: { assets: [], styles: ['style.scss'] },
-            configDir: '.storybook',
-            loglevel: undefined,
-            quiet: false,
-            outputDir: 'storybook-static',
-            packageJson: vitest_1.expect.any(Object),
-            mode: 'static',
-            tsConfig: 'path/to/tsConfig.json',
-            statsJson: false,
-        }));
-    });
-});