mirror of
https://github.com/storybookjs/storybook.git
synced 2025-04-07 05:21:06 +08:00
remove .stories.mdx stories and fix tests
This commit is contained in:
Yann Braga
parent
a80c3d5ce4
commit
1be44eb1b4
@ -1,25 +0,0 @@
|
||||
import { global as globalThis } from '@storybook/global';
|
||||
import { moduleMetadata } from '@storybook/angular';
|
||||
import { Meta, Story, Canvas } from '@storybook/addon-docs';
|
||||
|
||||
export const Button = globalThis.Components.Button;
|
||||
|
||||
<Meta
|
||||
title="angular/angular-mdx"
|
||||
component={Button}
|
||||
decorators={[moduleMetadata({ declarations: [Button] })]}
|
||||
/>
|
||||
|
||||
# Angular-specific MDX Stories
|
||||
|
||||
<Canvas>
|
||||
<Story name="Angular Story">
|
||||
{{
|
||||
template: `<storybook-framework-button [label]="text" (onClick)="onClick($event)"></storybook-framework-button>`,
|
||||
props: {
|
||||
text: 'hello button',
|
||||
onClick: () => {},
|
||||
},
|
||||
}}
|
||||
</Story>
|
||||
</Canvas>
|
||||
@ -7,7 +7,6 @@ import { describe, beforeEach, it, expect, vi } from 'vitest';
|
||||
|
||||
import path from 'path';
|
||||
// @ts-expect-error -- cannot find declaration file
|
||||
import { createStoriesMdxIndexer } from '@storybook/addon-docs/preset';
|
||||
import { normalizeStoriesEntry } from '@storybook/core-common';
|
||||
import type { NormalizedStoriesSpecifier, StoryIndexEntry } from '@storybook/types';
|
||||
import { readCsf, getStorySortParameter } from '@storybook/csf-tools';
|
||||
@ -45,7 +44,7 @@ const options: StoryIndexGeneratorOptions = {
|
||||
configDir: path.join(__dirname, '__mockdata__'),
|
||||
workingDir: path.join(__dirname, '__mockdata__'),
|
||||
storyIndexers: [],
|
||||
indexers: [csfIndexer, createStoriesMdxIndexer(false)],
|
||||
indexers: [csfIndexer],
|
||||
storyStoreV7: true,
|
||||
docs: { defaultName: 'docs', autodocs: false },
|
||||
};
|
||||
@ -292,51 +291,6 @@ describe('StoryIndexGenerator', () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe('mdx tagged components', () => {
|
||||
it('adds docs entry with docs enabled', async () => {
|
||||
const specifier: NormalizedStoriesSpecifier = normalizeStoriesEntry(
|
||||
'./src/nested/Page.stories.mdx',
|
||||
options
|
||||
);
|
||||
|
||||
const generator = new StoryIndexGenerator([specifier], {
|
||||
...options,
|
||||
});
|
||||
await generator.initialize();
|
||||
|
||||
expect(await generator.getIndex()).toMatchInlineSnapshot(`
|
||||
{
|
||||
"entries": {
|
||||
"page--docs": {
|
||||
"id": "page--docs",
|
||||
"importPath": "./src/nested/Page.stories.mdx",
|
||||
"name": "docs",
|
||||
"storiesImports": [],
|
||||
"tags": [
|
||||
"stories-mdx",
|
||||
"docs",
|
||||
],
|
||||
"title": "Page",
|
||||
"type": "docs",
|
||||
},
|
||||
"page--story-one": {
|
||||
"id": "page--story-one",
|
||||
"importPath": "./src/nested/Page.stories.mdx",
|
||||
"name": "StoryOne",
|
||||
"tags": [
|
||||
"stories-mdx",
|
||||
"story",
|
||||
],
|
||||
"title": "Page",
|
||||
"type": "story",
|
||||
},
|
||||
},
|
||||
"v": 4,
|
||||
}
|
||||
`);
|
||||
}, 20_000);
|
||||
});
|
||||
|
||||
describe('autodocs', () => {
|
||||
const autodocsOptions = {
|
||||
...options,
|
||||
|
||||
@ -1,5 +0,0 @@
|
||||
import { Meta, Story } from '@storybook/addon-docs';
|
||||
|
||||
<Meta component={{}} />
|
||||
|
||||
<Story name="StoryOne" />
|
||||
@ -604,53 +604,4 @@ describe('docs entries from story extraction', () => {
|
||||
}
|
||||
`);
|
||||
});
|
||||
it(`Only adds a docs entry and not a story entry when an input has the "docsOnly" tag`, async () => {
|
||||
const relativePath = './src/nested/Page.stories.mdx';
|
||||
const absolutePath = path.join(options.workingDir, relativePath);
|
||||
const specifier: NormalizedStoriesSpecifier = normalizeStoriesEntry(relativePath, options);
|
||||
|
||||
const generator = new StoryIndexGenerator([specifier], {
|
||||
...options,
|
||||
docs: { defaultName: 'docs', autodocs: false },
|
||||
indexers: [
|
||||
{
|
||||
test: /\.stories\.mdx?$/,
|
||||
createIndex: async (fileName) => [
|
||||
{
|
||||
exportName: '__page',
|
||||
__id: 'page--page',
|
||||
name: 'Page',
|
||||
title: 'Page',
|
||||
tags: [STORIES_MDX_TAG, 'stories-mdx-docsOnly'],
|
||||
importPath: fileName,
|
||||
type: 'story',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
});
|
||||
const result = await generator.extractStories(specifier, absolutePath);
|
||||
|
||||
expect(result).toMatchInlineSnapshot(`
|
||||
{
|
||||
"dependents": [],
|
||||
"entries": [
|
||||
{
|
||||
"id": "page--docs",
|
||||
"importPath": "./src/nested/Page.stories.mdx",
|
||||
"name": "docs",
|
||||
"storiesImports": [],
|
||||
"tags": [
|
||||
"stories-mdx",
|
||||
"stories-mdx-docsOnly",
|
||||
"docs",
|
||||
],
|
||||
"title": "Page",
|
||||
"type": "docs",
|
||||
},
|
||||
],
|
||||
"type": "stories",
|
||||
}
|
||||
`);
|
||||
});
|
||||
});
|
||||
|
||||
@ -4,8 +4,6 @@ import type { Router, Request, Response } from 'express';
|
||||
import Watchpack from 'watchpack';
|
||||
import path from 'path';
|
||||
import debounce from 'lodash/debounce.js';
|
||||
// @ts-expect-error -- cannot find declaration file
|
||||
import { createStoriesMdxIndexer } from '@storybook/addon-docs/preset';
|
||||
import { STORY_INDEX_INVALIDATED } from '@storybook/core-events';
|
||||
import { normalizeStoriesEntry } from '@storybook/core-common';
|
||||
|
||||
@ -45,7 +43,7 @@ const getInitializedStoryIndexGenerator = async (
|
||||
) => {
|
||||
const options: StoryIndexGeneratorOptions = {
|
||||
storyIndexers: [],
|
||||
indexers: [csfIndexer, createStoriesMdxIndexer(false)],
|
||||
indexers: [csfIndexer],
|
||||
configDir: workingDir,
|
||||
workingDir,
|
||||
storyStoreV7: true,
|
||||
@ -239,29 +237,6 @@ describe('useStoriesJson', () => {
|
||||
"title": "nested/Button",
|
||||
"type": "story",
|
||||
},
|
||||
"nested-page--docs": {
|
||||
"id": "nested-page--docs",
|
||||
"importPath": "./src/nested/Page.stories.mdx",
|
||||
"name": "docs",
|
||||
"storiesImports": [],
|
||||
"tags": [
|
||||
"stories-mdx",
|
||||
"docs",
|
||||
],
|
||||
"title": "nested/Page",
|
||||
"type": "docs",
|
||||
},
|
||||
"nested-page--story-one": {
|
||||
"id": "nested-page--story-one",
|
||||
"importPath": "./src/nested/Page.stories.mdx",
|
||||
"name": "StoryOne",
|
||||
"tags": [
|
||||
"stories-mdx",
|
||||
"story",
|
||||
],
|
||||
"title": "nested/Page",
|
||||
"type": "story",
|
||||
},
|
||||
"second-nested-g--story-one": {
|
||||
"id": "second-nested-g--story-one",
|
||||
"importPath": "./src/second-nested/G.stories.ts",
|
||||
|
||||
@ -1,21 +0,0 @@
|
||||
import { Meta, Story, Canvas } from '@storybook/addon-docs';
|
||||
|
||||
<Meta title="html/html-mdx" />
|
||||
|
||||
## HTML-specific MDX Stories
|
||||
|
||||
<Canvas>
|
||||
<Story name="Basic" height="100px">
|
||||
{'<h1>Hello World</h1>'}
|
||||
</Story>
|
||||
</Canvas>
|
||||
|
||||
<Canvas>
|
||||
<Story name="Function" height="100px">
|
||||
{() => {
|
||||
const btn = document.createElement('button');
|
||||
btn.innerHTML = 'Hello Button';
|
||||
return btn;
|
||||
}}
|
||||
</Story>
|
||||
</Canvas>
|
||||
@ -1,48 +0,0 @@
|
||||
import { global as globalThis } from '@storybook/global';
|
||||
import { Meta, Story, Canvas } from '@storybook/addon-docs';
|
||||
import ButtonView from './views/ButtonJavaScript.svelte';
|
||||
import BorderDecoratorRed from './views/BorderDecoratorRed.svelte';
|
||||
|
||||
<Meta title="stories/renderers/svelte/svelte-mdx" />
|
||||
|
||||
# Svelte-specific MDX stories
|
||||
|
||||
## Primary
|
||||
|
||||
<Canvas>
|
||||
<Story name="Primary">
|
||||
{{
|
||||
Component: ButtonView,
|
||||
props: {
|
||||
primary: true,
|
||||
text: 'Primary text',
|
||||
},
|
||||
}}
|
||||
</Story>
|
||||
</Canvas>
|
||||
|
||||
## Secondary
|
||||
|
||||
<Canvas>
|
||||
<Story name="Secondary">
|
||||
{{
|
||||
Component: ButtonView,
|
||||
props: {
|
||||
primary: false,
|
||||
text: 'Secondary text',
|
||||
},
|
||||
}}
|
||||
</Story>
|
||||
</Canvas>
|
||||
|
||||
<Canvas>
|
||||
<Story name="WithDecorator" decorators={[() => BorderDecoratorRed]}>
|
||||
{{
|
||||
Component: ButtonView,
|
||||
props: {
|
||||
primary: false,
|
||||
text: 'Secondary text',
|
||||
},
|
||||
}}
|
||||
</Story>
|
||||
</Canvas>
|
||||
@ -1,46 +0,0 @@
|
||||
import { global as globalThis } from '@storybook/global';
|
||||
import { Meta, Story, Canvas } from '@storybook/addon-docs';
|
||||
|
||||
<Meta title="stories/renderers/vue3/vue3-mdx" />
|
||||
|
||||
# Vue3-specific MDX Stories
|
||||
|
||||
export const Button = globalThis.Components.Button;
|
||||
|
||||
export const Template = (args, { argTypes }) => ({
|
||||
components: { MyButton: Button },
|
||||
template: '<my-button v-bind="args" />',
|
||||
setup() {
|
||||
return { args };
|
||||
},
|
||||
});
|
||||
|
||||
## Primary
|
||||
|
||||
<Canvas>
|
||||
<Story name="Primary">
|
||||
{{
|
||||
components: { MyButton: Button },
|
||||
template: '<my-button :primary="true" label="Primary button" />',
|
||||
}}
|
||||
</Story>
|
||||
</Canvas>
|
||||
|
||||
## Secondary
|
||||
|
||||
<Canvas>
|
||||
<Story name="Secondary">
|
||||
{{
|
||||
components: { MyButton: Button },
|
||||
template: '<my-button :primary="false" label="Secondary button" />',
|
||||
}}
|
||||
</Story>
|
||||
</Canvas>
|
||||
|
||||
## From template
|
||||
|
||||
<Canvas>
|
||||
<Story name="From Template" args={{ label: 'From template' }}>
|
||||
{Template.bind({})}
|
||||
</Story>
|
||||
</Canvas>
|
||||
Loading…
x
Reference in New Issue
Block a user