From 22bcdd0d8932992b77e21e1a94143d3b5b26d905 Mon Sep 17 00:00:00 2001 From: Mark Date: Mon, 24 Oct 2022 23:23:14 -0500 Subject: [PATCH] Fix some of the Angular tests --- .../src/builders/build-storybook/index.spec.ts | 2 +- .../src/builders/start-storybook/index.spec.ts | 2 +- .../angular/src/builders/utils/run-compodoc.spec.ts | 2 ++ .../src/client/angular-beta/RendererFactory.test.ts | 12 +++++++----- .../src/client/angular-beta/StorybookModule.ts | 12 +++++++++++- 5 files changed, 22 insertions(+), 8 deletions(-) diff --git a/code/frameworks/angular/src/builders/build-storybook/index.spec.ts b/code/frameworks/angular/src/builders/build-storybook/index.spec.ts index 6703244616d..7e6e2b729c0 100644 --- a/code/frameworks/angular/src/builders/build-storybook/index.spec.ts +++ b/code/frameworks/angular/src/builders/build-storybook/index.spec.ts @@ -4,7 +4,7 @@ import { schema } from '@angular-devkit/core'; import * as path from 'path'; const buildStandaloneMock = jest.fn(); -jest.doMock('@storybook/angular/standalone', () => buildStandaloneMock); +jest.doMock('@storybook/core-server/standalone', () => buildStandaloneMock); jest.doMock('find-up', () => ({ sync: () => './storybook/tsconfig.ts' })); const cpSpawnMock = { diff --git a/code/frameworks/angular/src/builders/start-storybook/index.spec.ts b/code/frameworks/angular/src/builders/start-storybook/index.spec.ts index 381024a4639..08192679343 100644 --- a/code/frameworks/angular/src/builders/start-storybook/index.spec.ts +++ b/code/frameworks/angular/src/builders/start-storybook/index.spec.ts @@ -4,7 +4,7 @@ import { schema } from '@angular-devkit/core'; import * as path from 'path'; const buildStandaloneMock = jest.fn(); -jest.doMock('@storybook/angular/standalone', () => buildStandaloneMock); +jest.doMock('@storybook/core-server/standalone', () => buildStandaloneMock); jest.doMock('find-up', () => ({ sync: () => './storybook/tsconfig.ts' })); const cpSpawnMock = { diff --git a/code/frameworks/angular/src/builders/utils/run-compodoc.spec.ts b/code/frameworks/angular/src/builders/utils/run-compodoc.spec.ts index 900bc6a7669..06d0f37a522 100644 --- a/code/frameworks/angular/src/builders/utils/run-compodoc.spec.ts +++ b/code/frameworks/angular/src/builders/utils/run-compodoc.spec.ts @@ -51,6 +51,7 @@ describe('runCompodoc', () => { ['compodoc', '-p', 'path/to/tsconfig.json', '-d', 'path/to/project'], { cwd: 'path/to/project', + shell: true, } ); }); @@ -74,6 +75,7 @@ describe('runCompodoc', () => { ['compodoc', '-d', 'path/to/project', '-p', 'path/to/tsconfig.stories.json'], { cwd: 'path/to/project', + shell: true, } ); }); diff --git a/code/frameworks/angular/src/client/angular-beta/RendererFactory.test.ts b/code/frameworks/angular/src/client/angular-beta/RendererFactory.test.ts index 0129a09f68a..a50a8c5ff80 100644 --- a/code/frameworks/angular/src/client/angular-beta/RendererFactory.test.ts +++ b/code/frameworks/angular/src/client/angular-beta/RendererFactory.test.ts @@ -18,8 +18,8 @@ describe('RendererFactory', () => { beforeEach(async () => { rendererFactory = new RendererFactory(); document.body.innerHTML = - '
'; - rootTargetDOMNode = global.document.getElementById('root'); + '
'; + rootTargetDOMNode = global.document.getElementById('storybook-root'); rootDocstargetDOMNode = global.document.getElementById('root-docs'); (platformBrowserDynamic as any).mockImplementation(platformBrowserDynamicTesting); jest.spyOn(console, 'log').mockImplementation(() => {}); @@ -301,14 +301,16 @@ describe('RendererFactory', () => { }); it('should reset root HTML', async () => { - global.document.getElementById('root').appendChild(global.document.createElement('👾')); + global.document + .getElementById('storybook-root') + .appendChild(global.document.createElement('👾')); - expect(global.document.getElementById('root').innerHTML).toContain('Canvas 🖼'); + expect(global.document.getElementById('storybook-root').innerHTML).toContain('Canvas 🖼'); const render = await rendererFactory.getRendererInstance( 'my-story-in-docs', rootDocstargetDOMNode ); - expect(global.document.getElementById('root').innerHTML).toBe(''); + expect(global.document.getElementById('storybook-root').innerHTML).toBe(''); }); }); diff --git a/code/frameworks/angular/src/client/angular-beta/StorybookModule.ts b/code/frameworks/angular/src/client/angular-beta/StorybookModule.ts index 7bc401b66c5..5403a3ecbea 100644 --- a/code/frameworks/angular/src/client/angular-beta/StorybookModule.ts +++ b/code/frameworks/angular/src/client/angular-beta/StorybookModule.ts @@ -7,6 +7,7 @@ import { storyPropsProvider } from './StorybookProvider'; import { isComponentAlreadyDeclaredInModules } from './utils/NgModulesAnalyzer'; import { isDeclarable, isStandaloneComponent } from './utils/NgComponentAnalyzer'; import { createStorybookWrapperComponent } from './StorybookWrapperComponent'; +import { computesTemplateFromComponent } from './ComputesTemplateFromComponent'; export const getStorybookModuleMetadata = ( { @@ -21,7 +22,12 @@ export const getStorybookModuleMetadata = ( storyProps$: Subject ): NgModule => { const { props, styles, moduleMetadata = {} } = storyFnAngular; - const { template } = storyFnAngular; + let { template } = storyFnAngular; + + const hasTemplate = !hasNoTemplate(template); + if (!hasTemplate && component) { + template = computesTemplateFromComponent(component, props, ''); + } /** * Create a component that wraps generated template and gives it props @@ -68,3 +74,7 @@ export const createStorybookModule = (ngModule: NgModule): Type => { class StorybookModule {} return StorybookModule; }; + +function hasNoTemplate(template: string | null | undefined): template is undefined { + return template === null || template === undefined; +}