mirror of
https://github.com/storybookjs/storybook.git
synced 2025-04-04 19:21:07 +08:00
chore(angular): update angular to v12
This commit is contained in:
ThibaudAv
Thibaud Av
parent
506ba137e5
commit
87c2aec879
@ -102,7 +102,7 @@
|
||||
"util-deprecate": "^1.0.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular/core": "^11.2.14",
|
||||
"@angular/core": "^12.1.4",
|
||||
"@babel/core": "^7.12.10",
|
||||
"@emotion/core": "^10.1.1",
|
||||
"@emotion/styled": "^10.0.27",
|
||||
|
||||
@ -5,7 +5,8 @@ export const deepElementFromPoint = (x: number, y: number) => {
|
||||
|
||||
const crawlShadows = (node: Element): Element => {
|
||||
if (node && node.shadowRoot) {
|
||||
const nestedElement = node.shadowRoot.elementFromPoint(x, y);
|
||||
// elementFromPoint() doesn't exist in ShadowRoot type
|
||||
const nestedElement = (node.shadowRoot as any).elementFromPoint(x, y);
|
||||
|
||||
// Nested node is same as the root one
|
||||
if (node.isEqualNode(nestedElement)) {
|
||||
|
||||
@ -67,8 +67,8 @@
|
||||
"ts-dedent": "^2.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular/core": "^11.2.0",
|
||||
"@angular/platform-browser-dynamic": "^11.2.0",
|
||||
"@angular/core": "^12.1.4",
|
||||
"@angular/platform-browser-dynamic": "^12.1.4",
|
||||
"@storybook/addon-docs": "6.4.0-beta.22",
|
||||
"@storybook/angular": "6.4.0-beta.22",
|
||||
"@storybook/react": "6.4.0-beta.22",
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
module.exports = {
|
||||
preset: 'jest-preset-angular',
|
||||
setupFilesAfterEnv: ['<rootDir>/setup-jest.ts'],
|
||||
transformIgnorePatterns: ['^.+\\.js$'],
|
||||
};
|
||||
|
||||
@ -75,23 +75,24 @@
|
||||
"webpack": "4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular-devkit/architect": "~0.1102.0",
|
||||
"@angular-devkit/build-angular": "~0.1102.13",
|
||||
"@angular-devkit/core": "^11.2.13",
|
||||
"@angular/common": "^11.2.14",
|
||||
"@angular/compiler": "^11.2.14",
|
||||
"@angular/compiler-cli": "^11.2.14",
|
||||
"@angular/core": "^11.2.14",
|
||||
"@angular/elements": "^11.2.14",
|
||||
"@angular/forms": "^11.2.14",
|
||||
"@angular/platform-browser": "^11.2.14",
|
||||
"@angular/platform-browser-dynamic": "^11.2.14",
|
||||
"@nrwl/workspace": "^11.6.3",
|
||||
"@angular-devkit/architect": "~0.1201.4",
|
||||
"@angular-devkit/build-angular": "^12.1.4",
|
||||
"@angular-devkit/core": "^12.1.4",
|
||||
"@angular/common": "^12.1.4",
|
||||
"@angular/compiler": "^12.1.4",
|
||||
"@angular/compiler-cli": "^12.1.4",
|
||||
"@angular/core": "^12.1.4",
|
||||
"@angular/elements": "^12.1.4",
|
||||
"@angular/forms": "^12.1.4",
|
||||
"@angular/platform-browser": "^12.1.4",
|
||||
"@angular/platform-browser-dynamic": "^12.1.4",
|
||||
"@nrwl/workspace": "^12.3.6",
|
||||
"@types/autoprefixer": "^9.7.2",
|
||||
"@types/jest": "^26.0.16",
|
||||
"@webcomponents/custom-elements": "^1.4.3",
|
||||
"jest": "^26.6.3",
|
||||
"jest-preset-angular": "^8.3.2",
|
||||
"jest-preset-angular": "^8.4.0",
|
||||
"rxjs": "^6.6.3",
|
||||
"ts-jest": "^26.4.4"
|
||||
},
|
||||
"peerDependencies": {
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
// eslint-disable-next-line import/no-extraneous-dependencies
|
||||
import 'jest-preset-angular';
|
||||
import 'jest-preset-angular/setup-jest';
|
||||
|
||||
global.EventSource = class {} as any;
|
||||
|
||||
@ -117,6 +117,9 @@ const buildWebpackConfigOptions = async (
|
||||
scripts: [],
|
||||
sourceMap: {},
|
||||
styles: [],
|
||||
// Deleted in angular 12. Keep for compatibility with versions lower than angular 12
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
lazyModules: [],
|
||||
|
||||
// Project Options
|
||||
@ -131,6 +134,10 @@ const buildWebpackConfigOptions = async (
|
||||
|
||||
// Forced options
|
||||
statsJson: false,
|
||||
|
||||
// Deleted in angular 12. Keep for compatibility with versions lower than angular 12
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
forkTypeChecker: false,
|
||||
};
|
||||
|
||||
|
||||
@ -185,27 +185,47 @@ describe('framework-preset-angular-cli', () => {
|
||||
const baseWebpackConfig = newWebpackConfiguration();
|
||||
const webpackFinalConfig = await webpackFinal(baseWebpackConfig, options);
|
||||
|
||||
const expectedRules: any = [
|
||||
{
|
||||
oneOf: [
|
||||
{
|
||||
exclude: [],
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [],
|
||||
use: expect.anything(),
|
||||
},
|
||||
],
|
||||
},
|
||||
{ use: expect.anything() },
|
||||
];
|
||||
expect(webpackFinalConfig.module.rules).toEqual([
|
||||
{
|
||||
exclude: [],
|
||||
test: /\.css$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:css)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [],
|
||||
test: /\.scss$|\.sass$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:scss)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [],
|
||||
test: /\.less$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:sass)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [],
|
||||
test: /\.styl$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:less)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
test: /\.(?:styl)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{ mimetype: 'text/css', use: expect.anything() },
|
||||
{ mimetype: 'text/x-scss', use: expect.anything() },
|
||||
{ mimetype: 'text/x-sass', use: expect.anything() },
|
||||
{ mimetype: 'text/x-less', use: expect.anything() },
|
||||
{ mimetype: 'text/x-stylus', use: expect.anything() },
|
||||
...baseWebpackConfig.module.rules,
|
||||
]);
|
||||
});
|
||||
@ -220,9 +240,8 @@ describe('framework-preset-angular-cli', () => {
|
||||
"budgets": Array [],
|
||||
},
|
||||
ContextReplacementPlugin {
|
||||
"newContentRecursive": undefined,
|
||||
"newContentRegExp": undefined,
|
||||
"newContentResource": undefined,
|
||||
"newContentCreateContextMap": [Function],
|
||||
"newContentResource": "${workspaceRoot}/$_lazy_route_resources",
|
||||
"resourceRegExp": /\\\\@angular\\(\\\\\\\\\\|\\\\/\\)core\\(\\\\\\\\\\|\\\\/\\)/,
|
||||
},
|
||||
DedupeModuleResolvePlugin {
|
||||
@ -307,47 +326,47 @@ describe('framework-preset-angular-cli', () => {
|
||||
const baseWebpackConfig = newWebpackConfiguration();
|
||||
const webpackFinalConfig = await webpackFinal(baseWebpackConfig, options);
|
||||
|
||||
const expectedRules = [
|
||||
{
|
||||
oneOf: [
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
use: expect.anything(),
|
||||
},
|
||||
],
|
||||
},
|
||||
{ use: expect.anything() },
|
||||
];
|
||||
expect(webpackFinalConfig.module.rules).toEqual([
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.css$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:css)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.scss$|\.sass$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:scss)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.less$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:sass)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.styl$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:less)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.css$/,
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.scss$|\.sass$/,
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.less$/,
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.styl$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:styl)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{ mimetype: 'text/css', use: expect.anything() },
|
||||
{ mimetype: 'text/x-scss', use: expect.anything() },
|
||||
{ mimetype: 'text/x-sass', use: expect.anything() },
|
||||
{ mimetype: 'text/x-less', use: expect.anything() },
|
||||
{ mimetype: 'text/x-stylus', use: expect.anything() },
|
||||
...baseWebpackConfig.module.rules,
|
||||
]);
|
||||
});
|
||||
@ -398,47 +417,47 @@ describe('framework-preset-angular-cli', () => {
|
||||
const baseWebpackConfig = newWebpackConfiguration();
|
||||
const webpackFinalConfig = await webpackFinal(baseWebpackConfig, options);
|
||||
|
||||
const expectedRules: any = [
|
||||
{
|
||||
oneOf: [
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
use: expect.anything(),
|
||||
},
|
||||
],
|
||||
},
|
||||
{ use: expect.anything() },
|
||||
];
|
||||
expect(webpackFinalConfig.module.rules).toEqual([
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.css$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:css)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.scss$|\.sass$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:scss)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.less$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:sass)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.styl$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:less)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.css$/,
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.scss$|\.sass$/,
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.less$/,
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.styl$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:styl)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{ mimetype: 'text/css', use: expect.anything() },
|
||||
{ mimetype: 'text/x-scss', use: expect.anything() },
|
||||
{ mimetype: 'text/x-sass', use: expect.anything() },
|
||||
{ mimetype: 'text/x-less', use: expect.anything() },
|
||||
{ mimetype: 'text/x-stylus', use: expect.anything() },
|
||||
...baseWebpackConfig.module.rules,
|
||||
]);
|
||||
});
|
||||
@ -476,47 +495,47 @@ describe('framework-preset-angular-cli', () => {
|
||||
const baseWebpackConfig = newWebpackConfiguration();
|
||||
const webpackFinalConfig = await webpackFinal(baseWebpackConfig, options);
|
||||
|
||||
const expectedRules: any = [
|
||||
{
|
||||
oneOf: [
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
use: expect.anything(),
|
||||
},
|
||||
],
|
||||
},
|
||||
{ use: expect.anything() },
|
||||
];
|
||||
expect(webpackFinalConfig.module.rules).toEqual([
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.css$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:css)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.scss$|\.sass$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:scss)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.less$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:sass)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.styl$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:less)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.css$/,
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.scss$|\.sass$/,
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.less$/,
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [`${workspaceRoot}/src/styles.css`, `${workspaceRoot}/src/styles.scss`],
|
||||
test: /\.styl$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:styl)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{ mimetype: 'text/css', use: expect.anything() },
|
||||
{ mimetype: 'text/x-scss', use: expect.anything() },
|
||||
{ mimetype: 'text/x-sass', use: expect.anything() },
|
||||
{ mimetype: 'text/x-less', use: expect.anything() },
|
||||
{ mimetype: 'text/x-stylus', use: expect.anything() },
|
||||
...baseWebpackConfig.module.rules,
|
||||
]);
|
||||
});
|
||||
@ -550,27 +569,47 @@ describe('framework-preset-angular-cli', () => {
|
||||
const baseWebpackConfig = newWebpackConfiguration();
|
||||
const webpackFinalConfig = await webpackFinal(baseWebpackConfig, options);
|
||||
|
||||
const expectedRules: any = [
|
||||
{
|
||||
oneOf: [
|
||||
{
|
||||
exclude: [],
|
||||
use: expect.anything(),
|
||||
},
|
||||
{
|
||||
include: [],
|
||||
use: expect.anything(),
|
||||
},
|
||||
],
|
||||
},
|
||||
{ use: expect.anything() },
|
||||
];
|
||||
expect(webpackFinalConfig.module.rules).toEqual([
|
||||
{
|
||||
exclude: [],
|
||||
test: /\.css$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:css)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [],
|
||||
test: /\.scss$|\.sass$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:scss)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [],
|
||||
test: /\.less$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:sass)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
exclude: [],
|
||||
test: /\.styl$/,
|
||||
use: expect.anything(),
|
||||
test: /\.(?:less)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{
|
||||
test: /\.(?:styl)$/i,
|
||||
rules: expectedRules,
|
||||
},
|
||||
{ mimetype: 'text/css', use: expect.anything() },
|
||||
{ mimetype: 'text/x-scss', use: expect.anything() },
|
||||
{ mimetype: 'text/x-sass', use: expect.anything() },
|
||||
{ mimetype: 'text/x-less', use: expect.anything() },
|
||||
{ mimetype: 'text/x-stylus', use: expect.anything() },
|
||||
...baseWebpackConfig.module.rules,
|
||||
]);
|
||||
});
|
||||
|
||||
@ -27,7 +27,7 @@ export function webpack(
|
||||
},
|
||||
{
|
||||
test: /[/\\]@angular[/\\]core[/\\].+\.js$/,
|
||||
parser: { system: true },
|
||||
parser: { system: false },
|
||||
},
|
||||
{
|
||||
test: /\.html$/,
|
||||
|
||||
@ -15,7 +15,7 @@ module.exports = {
|
||||
'@storybook/addon-toolbars',
|
||||
],
|
||||
core: {
|
||||
builder: 'webpack4',
|
||||
builder: 'webpack5',
|
||||
},
|
||||
angularOptions: {
|
||||
enableIvy: true,
|
||||
|
||||
@ -25,7 +25,14 @@
|
||||
"stylePreprocessorOptions": {
|
||||
"includePaths": ["src/commons"]
|
||||
},
|
||||
"scripts": []
|
||||
"scripts": [],
|
||||
"aot": false,
|
||||
"vendorChunk": true,
|
||||
"extractLicenses": false,
|
||||
"buildOptimizer": false,
|
||||
"sourceMap": true,
|
||||
"optimization": false,
|
||||
"namedChunks": true
|
||||
},
|
||||
"configurations": {
|
||||
"production": {
|
||||
@ -44,7 +51,8 @@
|
||||
"vendorChunk": false,
|
||||
"buildOptimizer": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"defaultConfiguration": ""
|
||||
},
|
||||
"serve": {
|
||||
"builder": "@angular-devkit/build-angular:dev-server",
|
||||
|
||||
@ -19,25 +19,25 @@
|
||||
"postinstall": "ngcc --source ../../node_modules"
|
||||
},
|
||||
"dependencies": {
|
||||
"@angular/common": "^11.2.14",
|
||||
"@angular/compiler": "^11.2.14",
|
||||
"@angular/core": "^11.2.14",
|
||||
"@angular/forms": "^11.2.14",
|
||||
"@angular/platform-browser": "^11.2.14",
|
||||
"@angular/platform-browser-dynamic": "^11.2.14",
|
||||
"@ngrx/store": "^10.1.2",
|
||||
"@angular/common": "^12.1.4",
|
||||
"@angular/compiler": "^12.1.4",
|
||||
"@angular/core": "^12.1.4",
|
||||
"@angular/forms": "^12.1.4",
|
||||
"@angular/platform-browser": "^12.1.4",
|
||||
"@angular/platform-browser-dynamic": "^12.1.4",
|
||||
"@ngrx/store": "^12.0.0",
|
||||
"core-js": "^3.8.2",
|
||||
"node-sass": "^4.14.1",
|
||||
"rxjs": "^6.6.3",
|
||||
"telejson": "^5.3.2",
|
||||
"zone.js": "^0.11.3"
|
||||
"zone.js": "~0.11.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular-devkit/build-angular": "~0.1102.13",
|
||||
"@angular-devkit/core": "^11.2.13",
|
||||
"@angular/cli": "^11.2.13",
|
||||
"@angular/compiler-cli": "^11.2.14",
|
||||
"@angular/elements": "^11.2.14",
|
||||
"@angular-devkit/build-angular": "^12.1.4",
|
||||
"@angular-devkit/core": "^12.1.4",
|
||||
"@angular/cli": "^12.1.4",
|
||||
"@angular/compiler-cli": "^12.1.4",
|
||||
"@angular/elements": "^12.1.4",
|
||||
"@compodoc/compodoc": "^1.1.14",
|
||||
"@storybook/addon-a11y": "6.4.0-beta.22",
|
||||
"@storybook/addon-actions": "6.4.0-beta.22",
|
||||
@ -69,7 +69,7 @@
|
||||
"storybook-addon-angular-ivy": "^0.0.1",
|
||||
"ts-jest": "^26.4.4",
|
||||
"ts-node": "^9.1.0",
|
||||
"typescript": "^4.1.3"
|
||||
"typescript": "4.2.4"
|
||||
},
|
||||
"storybook": {
|
||||
"chromatic": {
|
||||
|
||||
@ -50,7 +50,7 @@ import 'core-js/proposals/reflect-metadata';
|
||||
/** *************************************************************************************************
|
||||
* Zone JS is required by Angular itself.
|
||||
*/
|
||||
import 'zone.js/dist/zone'; // Included with Angular CLI.
|
||||
import 'zone.js'; // Included with Angular CLI.
|
||||
|
||||
/** *************************************************************************************************
|
||||
* APPLICATION IMPORTS
|
||||
|
||||
@ -3,47 +3,47 @@
|
||||
exports[`Storyshots Welcome/ To Storybook To Storybook 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-welcome-component
|
||||
_nghost-a-c44=""
|
||||
_nghost-a-c49=""
|
||||
>
|
||||
<main
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
>
|
||||
<h1
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
>
|
||||
Welcome to storybook
|
||||
</h1>
|
||||
<p
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
>
|
||||
This is a UI component dev environment for your app.
|
||||
</p>
|
||||
<p
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
>
|
||||
We've added some basic stories inside the
|
||||
<span
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
class="inline-code"
|
||||
>
|
||||
src/stories
|
||||
</span>
|
||||
directory.
|
||||
<br
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
/>
|
||||
A story is a single state of one or more UI components. You can have as many stories as you want.
|
||||
<br
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
/>
|
||||
(Basically a story is like a visual test case.)
|
||||
</p>
|
||||
<p
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
>
|
||||
See these sample
|
||||
<a
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
@ -51,7 +51,7 @@ exports[`Storyshots Welcome/ To Storybook To Storybook 1`] = `
|
||||
</a>
|
||||
for a component called
|
||||
<span
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
class="inline-code"
|
||||
>
|
||||
Button
|
||||
@ -59,26 +59,26 @@ exports[`Storyshots Welcome/ To Storybook To Storybook 1`] = `
|
||||
.
|
||||
</p>
|
||||
<p
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
>
|
||||
Just like that, you can add your own components as stories.
|
||||
<br
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
/>
|
||||
You can also edit those components and see changes right away.
|
||||
<br
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
/>
|
||||
(Try editing the
|
||||
<span
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
class="inline-code"
|
||||
>
|
||||
Button
|
||||
</span>
|
||||
stories located at
|
||||
<span
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
class="inline-code"
|
||||
>
|
||||
src/stories/index.js
|
||||
@ -86,15 +86,15 @@ exports[`Storyshots Welcome/ To Storybook To Storybook 1`] = `
|
||||
.)
|
||||
</p>
|
||||
<p
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
>
|
||||
Usually we create stories with smaller UI components in the app.
|
||||
<br
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
/>
|
||||
Have a look at the
|
||||
<a
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
href="https://storybook.js.org/basics/writing-stories"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
@ -104,20 +104,20 @@ exports[`Storyshots Welcome/ To Storybook To Storybook 1`] = `
|
||||
section in our documentation.
|
||||
</p>
|
||||
<p
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
class="note"
|
||||
>
|
||||
<b
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
>
|
||||
NOTE:
|
||||
</b>
|
||||
<br
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
/>
|
||||
Have a look at the
|
||||
<span
|
||||
_ngcontent-a-c44=""
|
||||
_ngcontent-a-c49=""
|
||||
class="inline-code"
|
||||
>
|
||||
.storybook/webpack.config.js
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`Storyshots Addons/Actions Component Output with ArgsTypes 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button 🥁"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button 🥁
|
||||
</button>
|
||||
@ -18,11 +18,11 @@ exports[`Storyshots Addons/Actions Component Output with ArgsTypes 1`] = `
|
||||
exports[`Storyshots Addons/Actions Component Output with EventEmitter 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button 🥁"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button 🥁
|
||||
</button>
|
||||
@ -41,11 +41,11 @@ exports[`Storyshots Addons/Actions Story with template 1`] = `
|
||||
exports[`Storyshots Addons/Actions Use action in method 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button 🥁"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button 🥁
|
||||
</button>
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`Storyshots Addons / Backgrounds Overridden 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="This one should have different"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
This one should have different backgrounds
|
||||
</button>
|
||||
@ -18,11 +18,11 @@ exports[`Storyshots Addons / Backgrounds Overridden 1`] = `
|
||||
exports[`Storyshots Addons / Backgrounds With Component 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button
|
||||
</button>
|
||||
@ -33,11 +33,11 @@ exports[`Storyshots Addons / Backgrounds With Component 1`] = `
|
||||
exports[`Storyshots Addons / Backgrounds With Template 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button
|
||||
</button>
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`Storyshots Addons/Docs with some emoji 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="😀 😎 👍 💯"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
😀 😎 👍 💯
|
||||
</button>
|
||||
@ -18,11 +18,11 @@ exports[`Storyshots Addons/Docs with some emoji 1`] = `
|
||||
exports[`Storyshots Addons/Docs with text 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="hello button"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
hello button
|
||||
</button>
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`Storyshots Addons/Docs/SimpleButton with text 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Hello 👋"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Hello 👋
|
||||
</button>
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`Storyshots Addons/Docs/Iframe Basic 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Add 👾"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Add 👾
|
||||
</button>
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`Storyshots Addons/Links button with link to another story 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Go to Welcome Story"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Go to Welcome Story
|
||||
</button>
|
||||
|
||||
@ -3,13 +3,13 @@
|
||||
exports[`Storyshots Core / Parameters / All parameters All parameters passed to story 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Parameters are {
|
||||
\\"docs\\": {
|
||||
"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Parameters are {
|
||||
"docs": {
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`Storyshots Core / Parameters / Layout Centered 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button
|
||||
</button>
|
||||
@ -18,11 +18,11 @@ exports[`Storyshots Core / Parameters / Layout Centered 1`] = `
|
||||
exports[`Storyshots Core / Parameters / Layout Default 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button
|
||||
</button>
|
||||
@ -36,12 +36,12 @@ exports[`Storyshots Core / Parameters / Layout Fullscreen 1`] = `
|
||||
style="background-color: yellow;"
|
||||
>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button"
|
||||
text="Button"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button
|
||||
</button>
|
||||
@ -54,11 +54,11 @@ exports[`Storyshots Core / Parameters / Layout Fullscreen 1`] = `
|
||||
exports[`Storyshots Core / Parameters / Layout None 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button
|
||||
</button>
|
||||
@ -69,11 +69,11 @@ exports[`Storyshots Core / Parameters / Layout None 1`] = `
|
||||
exports[`Storyshots Core / Parameters / Layout Padded 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button
|
||||
</button>
|
||||
|
||||
@ -3,12 +3,12 @@
|
||||
exports[`Storyshots Core / Story host styles With Args 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_ngcontent-a-c151=""
|
||||
_nghost-a-c47=""
|
||||
_ngcontent-a-c156=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button with custom styles"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button with custom styles
|
||||
</button>
|
||||
@ -19,12 +19,12 @@ exports[`Storyshots Core / Story host styles With Args 1`] = `
|
||||
exports[`Storyshots Core / Story host styles With story template 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_ngcontent-a-c150=""
|
||||
_nghost-a-c47=""
|
||||
_ngcontent-a-c155=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Button with custom styles"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Button with custom styles
|
||||
</button>
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`Storyshots Legacy / Component in Story Basic 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Hello Button"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Hello Button
|
||||
</button>
|
||||
|
||||
@ -3,20 +3,20 @@
|
||||
exports[`Storyshots Legacy / Story with storiesOf() with some emoji 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="😀 😎 👍 💯"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
😀 😎 👍 💯
|
||||
</button>
|
||||
</storybook-button-component><storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="😀 😎 👍 💯"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
😀 😎 👍 💯
|
||||
</button>
|
||||
@ -27,11 +27,11 @@ exports[`Storyshots Legacy / Story with storiesOf() with some emoji 1`] = `
|
||||
exports[`Storyshots Legacy / Story with storiesOf() with text 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Hello Button"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Hello Button
|
||||
</button>
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`Storyshots Others / Issues / 12009 unknown component Basic 1`] = `
|
||||
<storybook-wrapper>
|
||||
<storybook-button-component
|
||||
_nghost-a-c47=""
|
||||
_nghost-a-c52=""
|
||||
ng-reflect-text="Unknown component"
|
||||
>
|
||||
<button
|
||||
_ngcontent-a-c47=""
|
||||
_ngcontent-a-c52=""
|
||||
>
|
||||
Unknown component
|
||||
</button>
|
||||
|
||||
@ -272,7 +272,7 @@
|
||||
"ts-dedent": "^2.0.0",
|
||||
"ts-jest": "^26.4.4",
|
||||
"ts-node": "^9.1.0",
|
||||
"typescript": "^3.9.7",
|
||||
"typescript": "^4.2.0",
|
||||
"wait-on": "^5.2.1",
|
||||
"web-component-analyzer": "^1.1.6",
|
||||
"webpack": "4",
|
||||
|
||||
@ -17,6 +17,7 @@
|
||||
"lib": ["es2019", "dom"]
|
||||
},
|
||||
"exclude": [
|
||||
"dist",
|
||||
"**/dist",
|
||||
"node_modules",
|
||||
"**/node_modules",
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user