GitHub/storybook
1
0
Fork 0
mirror of https://github.com/storybookjs/storybook.git synced 2025-04-06 15:31:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fix manager-/preview-head.hTML bugs introduced in #1134

Browse Source
This commit is contained in:
Michael Shilman 2017-06-10 13:21:44 +12:00
parent 39b4c0380d
commit d39713519b
6 changed files with 18 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
app/react/src/server/build.js Normal file → Executable file
View File

@ -11,7 +11,7 @@ import getBaseConfig from './config/webpack.config.prod';
import loadConfig from './config'; import loadConfig from './config';
import getIndexHtml from './index.html'; import getIndexHtml from './index.html';
import getIframeHtml from './iframe.html'; import getIframeHtml from './iframe.html';
import { getHeadHtml, parseList, getEnvConfig } from './utils'; import { getPreviewHeadHtml, getManagerHeadHtml, parseList, getEnvConfig } from './utils';
process.env.NODE_ENV = process.env.NODE_ENV || 'production'; process.env.NODE_ENV = process.env.NODE_ENV || 'production';
@ -87,9 +87,14 @@ webpack(config).run((err, stats) => {
publicPath: config.output.publicPath, publicPath: config.output.publicPath,
assets: stats.toJson().assetsByChunkName, assets: stats.toJson().assetsByChunkName,
}; };
const headHtml = getHeadHtml(configDir);
// Write both the storybook UI and IFRAME HTML files to destination path. // Write both the storybook UI and IFRAME HTML files to destination path.
fs.writeFileSync(path.resolve(outputDir, 'index.html'), getIndexHtml(data)); fs.writeFileSync(
fs.writeFileSync(path.resolve(outputDir, 'iframe.html'), getIframeHtml({ ...data, headHtml })); path.resolve(outputDir, 'index.html'),
getIndexHtml({ ...data, headHtml: getManagerHeadHtml(configDir) })
);
fs.writeFileSync(
path.resolve(outputDir, 'iframe.html'),
getIframeHtml({ ...data, headHtml: getPreviewHeadHtml(configDir) })
);
}); });

4
app/react/src/server/iframe.html.js
View File

@ -38,9 +38,7 @@ const urlsFromAssets = assets => {
return urls; return urls;
}; };
export default function(data) { export default function({ assets, publicPath, headHtml }) {
const { assets, headHtml, publicPath } = data;
const urls = urlsFromAssets(assets); const urls = urlsFromAssets(assets);
const cssTags = urls.css const cssTags = urls.css

4
app/react/src/server/index.html.js
View File

@ -27,9 +27,7 @@ const managerUrlsFromAssets = assets => {
}; };
}; };
export default function(data) { export default function({ assets, publicPath, headHtml }) {
const { assets, publicPath, headHtml } = data;
const managerUrls = managerUrlsFromAssets(assets); const managerUrls = managerUrlsFromAssets(assets);
return ` return `

4
app/react/src/server/middleware.js
View File

@ -6,7 +6,7 @@ import getBaseConfig from './config/webpack.config';
import loadConfig from './config'; import loadConfig from './config';
import getIndexHtml from './index.html'; import getIndexHtml from './index.html';
import getIframeHtml from './iframe.html'; import getIframeHtml from './iframe.html';
import { getHeadHtml, getManagerHeadHtml, getMiddleware } from './utils'; import { getPreviewHeadHtml, getManagerHeadHtml, getMiddleware } from './utils';
let webpackResolve = () => {}; let webpackResolve = () => {};
let webpackReject = () => {}; let webpackReject = () => {};
@ -55,7 +55,7 @@ export default function(configDir) {
}); });
router.get('/iframe.html', (req, res) => { router.get('/iframe.html', (req, res) => {
const headHtml = getHeadHtml(configDir); const headHtml = getPreviewHeadHtml(configDir);
res.send(getIframeHtml({ ...data, headHtml, publicPath })); res.send(getIframeHtml({ ...data, headHtml, publicPath }));
}); });

2
app/react/src/server/utils.js
View File

@ -11,7 +11,7 @@ export function parseList(str) {
return str.split(','); return str.split(',');
} }
export function getHeadHtml(configDirPath) { export function getPreviewHeadHtml(configDirPath) {
const headHtmlPath = path.resolve(configDirPath, 'preview-head.html'); const headHtmlPath = path.resolve(configDirPath, 'preview-head.html');
const fallbackHtmlPath = path.resolve(configDirPath, 'head.html'); const fallbackHtmlPath = path.resolve(configDirPath, 'head.html');
let headHtml = ''; let headHtml = '';

8
app/react/src/server/utils.test.js
View File

@ -1,9 +1,9 @@
import mock from 'mock-fs'; import mock from 'mock-fs';
import { getHeadHtml } from './utils'; import { getPreviewHeadHtml } from './utils';
const HEAD_HTML_CONTENTS = '<script>console.log("custom script!");</script>'; const HEAD_HTML_CONTENTS = '<script>console.log("custom script!");</script>';
describe('server.getHeadHtml', () => { describe('server.getPreviewHeadHtml', () => {
describe('when .storybook/head.html does not exist', () => { describe('when .storybook/head.html does not exist', () => {
beforeEach(() => { beforeEach(() => {
mock({ mock({
@ -16,7 +16,7 @@ describe('server.getHeadHtml', () => {
}); });
it('return an empty string', () => { it('return an empty string', () => {
const result = getHeadHtml('./config'); const result = getPreviewHeadHtml('./config');
expect(result).toEqual(''); expect(result).toEqual('');
}); });
}); });
@ -35,7 +35,7 @@ describe('server.getHeadHtml', () => {
}); });
it('return the contents of the file', () => { it('return the contents of the file', () => {
const result = getHeadHtml('./config'); const result = getPreviewHeadHtml('./config');
expect(result).toEqual(HEAD_HTML_CONTENTS); expect(result).toEqual(HEAD_HTML_CONTENTS);
}); });
}); });