@component-controls/cc-cli

Table of contents

• Overview
• Install
• API
  • createStoreTemplate
  • createStoriesTemplate

Overview

• Easy to use cli with "zero" configuration.
• Generates test files in cjs, esm or typescript format.
• More advanced level to customize the framework renderer.
• Advanced level for full control over which stories to use for the tests.

Install

yarn add @component-controls/cc-cli --dev

API

createStoreTemplate

function

create one large dynamic test for all the stories in the configuration/bundle

defined in @component-controls/cc-cli/plugins/cc-cli/src/jest-templates/store-template.ts

parameters

Name	Type	Description
options*	P	rendering options
dataImports	DataImportOptions filePath*: string data*: Record<string, any>
configuration	type webpack: Configuration | WebpackConfigFn finalWebpack: Configuration | WebpackConfigFn presets: RuleType[] configPath: string distFolder: string bundleName: string staticFolder: string cssFileName: string logOptions: Partial<LogOptions> mode: "none" | "development" | "production" loaders encodeHTML*: encodeHTML at*: function ( index*: number ) => T | undefined module: string ident: string loader: string options: string | type stories: string | string[] files: string | string[] siteRoot: string ignore: string[] pages [string]: categories: DocType[] siteMap: type | boolean siteUrl: string instrument: any search indexingModule: string searchingModule*: string fields: SearchFields[] emptySearchDocuments: string[] hitsPerPage: number options: any tokens figmaAccessToken: string githubAccessToken: string component: string | Record<string, unknown> | ElementType<Props> subcomponents: Record<string, (string, Record<string, unknown>, ElementType<Props>)> controls [string]: ComponentControlText | ComponentControlBoolean | ComponentControlColor | ComponentControlDate | ComponentControlObject<> | ComponentControlButton<> | ComponentControlOptions<> | ComponentControlNumber | ComponentControlArray | ComponentControlFiles smartControls smart: boolean include: string[] | IncludeFn exclude: string[] | IncludeFn decorators: StoryRenderFn[] plugins: any category: string
returns	Promise<string>	a string with the rendered template

createStoriesTemplate

function

create tests on a stories base (a test file for each document and inside, a test for each story)

defined in @component-controls/cc-cli/plugins/cc-cli/src/jest-templates/stories-template.ts

parameters

Name	Type	Description
options*	P	rendering options
dataImports	DataImportOptions filePath*: string data*: Record<string, any>
configuration	BuildConfiguration webpack: Configuration | WebpackConfigFn finalWebpack: Configuration | WebpackConfigFn presets: RuleType[] configPath: string distFolder: string bundleName: string staticFolder: string cssFileName: string logOptions: Partial<LogOptions> mode: "none" | "development" | "production" loaders encodeHTML*: encodeHTML at*: function ( index*: ) => T | undefined module: string stories: string | string[] files: string | string[] siteRoot: string ignore: string[] pages [string]: categories: DocType[] siteMap: type | boolean siteUrl: string instrument: any search indexingModule: string searchingModule*: string fields: SearchFields[] emptySearchDocuments: string[] hitsPerPage: number options: any tokens figmaAccessToken: string githubAccessToken: string component: string | Record<string, unknown> | ElementType<Props> subcomponents: Record<string, (string, Record<string, unknown>, ElementType<Props>)> controls [string]: ComponentControlText | ComponentControlBoolean | ComponentControlColor | ComponentControlDate | ComponentControlObject<P> | ComponentControlButton | ComponentControlOptions | ComponentControlNumber | ComponentControlArray | ComponentControlFiles smartControls smart: boolean include: string[] | IncludeFn exclude: string[] | IncludeFn decorators: StoryRenderFn[] plugins: any category: string	global configuration used at build time stored in a file named main.js/main.ts
returns	Promise<string>	a string with the rendered template