Skip to content

Commit

Permalink
add compoent store and storybook
Browse files Browse the repository at this point in the history
  • Loading branch information
santoshyadavdev committed Apr 13, 2023
1 parent 0f44e98 commit 79d1357
Show file tree
Hide file tree
Showing 26 changed files with 6,657 additions and 330 deletions.
3 changes: 3 additions & 0 deletions apps/ngu-carousel-example/cypress.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import { defineConfig } from 'cypress';

export default defineConfig({});
5 changes: 5 additions & 0 deletions apps/ngu-carousel-example/cypress/fixtures/example.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"name": "Using fixtures to represent data",
"email": "hello@cypress.io",
"body": "Fixtures are a great way to mock data for responses to routes"
}
34 changes: 34 additions & 0 deletions apps/ngu-carousel-example/cypress/support/commands.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
/// <reference types="cypress" />
// ***********************************************
// This example commands.ts shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************

// eslint-disable-next-line @typescript-eslint/no-namespace
declare namespace Cypress {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
interface Chainable<Subject> {
login(email: string, password: string): void;
}
}
//
// -- This is a parent command --
Cypress.Commands.add('login', (email, password) => {
console.log('Custom command example: Login', email, password);
});
//
// -- This is a child command --
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This will overwrite an existing command --
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
12 changes: 12 additions & 0 deletions apps/ngu-carousel-example/cypress/support/component-index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<title>ngu-carousel-example Components App</title>
</head>
<body>
<div data-cy-root></div>
</body>
</html>
17 changes: 17 additions & 0 deletions apps/ngu-carousel-example/cypress/support/component.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
// ***********************************************************
// This example support/component.ts is processed and
// loaded automatically before your test files.
//
// This is a great place to put global configuration and
// behavior that modifies Cypress.
//
// You can change the location of this file or turn off
// automatically serving support files with the
// 'supportFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/configuration
// ***********************************************************

// Import commands.ts using ES2015 syntax:
import './commands';
17 changes: 17 additions & 0 deletions apps/ngu-carousel-example/cypress/tsconfig.cy.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../../../dist/out-tsc",
"module": "commonjs",
"types": ["cypress", "node"]
},
"include": [
"support/**/*.ts",
"../cypress.config.ts",
"../**/*.cy.ts",
"../**/*.cy.tsx",
"../**/*.cy.js",
"../**/*.cy.jsx",
"../**/*.d.ts"
]
}
8 changes: 8 additions & 0 deletions apps/ngu-carousel-example/project.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
{
"name": "ngu-carousel-example",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "application",
"generators": {
"@schematics/angular:component": {
Expand Down Expand Up @@ -101,6 +102,13 @@
"apps/ngu-carousel-example/**/*.html"
]
}
},
"component-test": {
"executor": "@nrwl/cypress:cypress",
"options": {
"cypressConfig": "apps/ngu-carousel-example/cypress.config.ts",
"testingType": "component"
}
}
}
}
11 changes: 9 additions & 2 deletions apps/ngu-carousel-example/tsconfig.app.json
Original file line number Diff line number Diff line change
@@ -1,10 +1,17 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"outDir": "./out-tsc/app",
"types": ["hammerjs"]
},
"files": ["src/main.ts", "src/polyfills.ts"],
"include": ["src/**/*.d.ts"]
"include": ["src/**/*.d.ts"],
"exclude": [
"cypress/**/*",
"cypress.config.ts",
"**/*.cy.ts",
"**/*.cy.js",
"**/*.cy.tsx",
"**/*.cy.jsx"
]
}
5 changes: 4 additions & 1 deletion libs/ngu/carousel/.eslintrc.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,10 @@
{
"files": ["*.ts"],
"parserOptions": {
"project": ["libs/ngu/carousel/tsconfig.*?.json"],
"project": [
"libs/ngu/carousel/tsconfig.*?.json",
"libs/ngu/carousel/.storybook/tsconfig.json"
],
"createDefaultProgram": true
},
"rules": {
Expand Down
9 changes: 9 additions & 0 deletions libs/ngu/carousel/.storybook/main.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
module.exports = {
core: { builder: 'webpack5' },
stories: ['../**/*.stories.mdx', '../**/*.stories.@(js|jsx|ts|tsx)'],
addons: ['@storybook/addon-essentials']
};

// To customize your webpack configuration you can use the webpackFinal field.
// Check https://storybook.js.org/docs/react/builders/webpack#extending-storybooks-webpack-config
// and https://nx.dev/packages/storybook/documents/custom-builder-configs
Empty file.
16 changes: 16 additions & 0 deletions libs/ngu/carousel/.storybook/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
{
"extends": "../tsconfig.json",
"compilerOptions": {
"emitDecoratorMetadata": true
},

"exclude": ["../**/*.spec.ts"],
"include": [
"../src/**/*.stories.ts",
"../src/**/*.stories.js",
"../src/**/*.stories.jsx",
"../src/**/*.stories.tsx",
"../src/**/*.stories.mdx",
"*.js"
]
}
3 changes: 3 additions & 0 deletions libs/ngu/carousel/cypress.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import { defineConfig } from 'cypress';

export default defineConfig({});
5 changes: 5 additions & 0 deletions libs/ngu/carousel/cypress/fixtures/example.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"name": "Using fixtures to represent data",
"email": "hello@cypress.io",
"body": "Fixtures are a great way to mock data for responses to routes"
}
34 changes: 34 additions & 0 deletions libs/ngu/carousel/cypress/support/commands.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
/// <reference types="cypress" />
// ***********************************************
// This example commands.ts shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************

// eslint-disable-next-line @typescript-eslint/no-namespace
declare namespace Cypress {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
interface Chainable<Subject> {
login(email: string, password: string): void;
}
}
//
// -- This is a parent command --
Cypress.Commands.add('login', (email, password) => {
console.log('Custom command example: Login', email, password);
});
//
// -- This is a child command --
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This will overwrite an existing command --
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
12 changes: 12 additions & 0 deletions libs/ngu/carousel/cypress/support/component-index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<title>@ngu/carousel Components App</title>
</head>
<body>
<div data-cy-root></div>
</body>
</html>
17 changes: 17 additions & 0 deletions libs/ngu/carousel/cypress/support/component.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
// ***********************************************************
// This example support/component.ts is processed and
// loaded automatically before your test files.
//
// This is a great place to put global configuration and
// behavior that modifies Cypress.
//
// You can change the location of this file or turn off
// automatically serving support files with the
// 'supportFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/configuration
// ***********************************************************

// Import commands.ts using ES2015 syntax:
import './commands';
17 changes: 17 additions & 0 deletions libs/ngu/carousel/cypress/tsconfig.cy.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../../../../dist/out-tsc",
"module": "commonjs",
"types": ["cypress", "node"]
},
"include": [
"support/**/*.ts",
"../cypress.config.ts",
"../**/*.cy.ts",
"../**/*.cy.tsx",
"../**/*.cy.js",
"../**/*.cy.jsx",
"../**/*.d.ts"
]
}
49 changes: 49 additions & 0 deletions libs/ngu/carousel/project.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
{
"name": "@ngu/carousel",
"$schema": "../../../node_modules/nx/schemas/project-schema.json",
"projectType": "library",
"sourceRoot": "libs/ngu/carousel/src",
"prefix": "ngu",
Expand Down Expand Up @@ -32,6 +33,54 @@
"options": {
"lintFilePatterns": ["libs/ngu/carousel/**/*.ts", "libs/ngu/carousel/**/*.html"]
}
},
"component-test": {
"executor": "@nrwl/cypress:cypress",
"options": {
"cypressConfig": "libs/ngu/carousel/cypress.config.ts",
"testingType": "component"
}
},
"storybook": {
"executor": "@storybook/angular:start-storybook",
"options": {
"port": 4400,
"configDir": "libs/ngu/carousel/.storybook",
"browserTarget": "@ngu/carousel:build-storybook",
"compodoc": false
},
"configurations": {
"ci": {
"quiet": true
}
}
},
"build-storybook": {
"executor": "@storybook/angular:build-storybook",
"outputs": ["{options.outputDir}"],
"options": {
"outputDir": "dist/storybook/@ngu/carousel",
"configDir": "libs/ngu/carousel/.storybook",
"browserTarget": "@ngu/carousel:build-storybook",
"compodoc": false
},
"configurations": {
"ci": {
"quiet": true
}
}
},
"static-storybook": {
"executor": "@nrwl/web:file-server",
"options": {
"buildTarget": "@ngu/carousel:build-storybook",
"staticFilePath": "dist/storybook/@ngu/carousel"
},
"configurations": {
"ci": {
"buildTarget": "@ngu/carousel:build-storybook:ci"
}
}
}
}
}
14 changes: 14 additions & 0 deletions libs/ngu/carousel/src/lib/ngu-item/ngu-item.component.stories.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import { Meta } from '@storybook/angular';
import { NguItemComponent } from './ngu-item.component';

export default {
title: 'NguItemComponent',
component: NguItemComponent
} as Meta<NguItemComponent>;

export const Primary = {
render: (args: NguItemComponent) => ({
props: args
}),
args: {}
};
14 changes: 14 additions & 0 deletions libs/ngu/carousel/src/lib/ngu-tile/ngu-tile.component.stories.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import { Meta } from '@storybook/angular';
import { NguTileComponent } from './ngu-tile.component';

export default {
title: 'NguTileComponent',
component: NguTileComponent
} as Meta<NguTileComponent>;

export const Primary = {
render: (args: NguTileComponent) => ({
props: args
}),
args: {}
};
6 changes: 6 additions & 0 deletions libs/ngu/carousel/tsconfig.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,12 @@
},
{
"path": "./tsconfig.spec.json"
},
{
"path": "./cypress/tsconfig.cy.json"
},
{
"path": "./.storybook/tsconfig.json"
}
],
"compilerOptions": {
Expand Down
13 changes: 12 additions & 1 deletion libs/ngu/carousel/tsconfig.lib.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,17 @@
"strictNullChecks": true,
"types": []
},
"exclude": ["src/test.ts", "**/*.spec.ts"],
"exclude": [
"src/test.ts",
"**/*.spec.ts",
"cypress/**/*",
"cypress.config.ts",
"**/*.cy.ts",
"**/*.cy.js",
"**/*.cy.tsx",
"**/*.cy.jsx",
"**/*.stories.ts",
"**/*.stories.js"
],
"include": ["**/*.ts"]
}
Loading

0 comments on commit 79d1357

Please sign in to comment.