How to use createCompiler method in storybook-root
Best JavaScript code snippet using storybook-root
MultiCompiler.test.js
Source:MultiCompiler.test.js 
...69 });70 describe("constructor", function() {71 describe("when provided an array of compilers", function() {72 beforeEach(function() {73 env.compilers = [createCompiler(), createCompiler()];74 env.myMultiCompiler = new MultiCompiler(env.compilers);75 });76 it("sets the compilers property to the array", function() {77 env.myMultiCompiler.compilers.should.be.exactly(env.compilers);78 });79 });80 describe("when provided a compiler mapping", function() {81 beforeEach(function() {82 var compilers = {83 compiler1: createCompiler(),84 compiler2: createCompiler()85 };86 env.myMultiCompiler = new MultiCompiler(compilers);87 });88 it("sets the compilers property to an array of compilers", function() {89 env.myMultiCompiler.compilers.should.deepEqual([90 Object.assign({91 name: "compiler1"92 }, createCompiler()),93 Object.assign({94 name: "compiler2"95 }, createCompiler())96 ]);97 });98 });99 describe("defined properties", function() {100 describe("outputFileSystem", function() {101 beforeEach(function() {102 env.compilers = [createCompiler(), createCompiler()];103 env.myMultiCompiler = new MultiCompiler(env.compilers);104 });105 it("throws an error when reading the value", function() {106 should(function() {107 env.myMultiCompiler.outputFileSystem108 }).throw("Cannot read outputFileSystem of a MultiCompiler");109 });110 it("updates all compilers when setting the value", function() {111 env.myMultiCompiler.outputFileSystem = "foo";112 env.compilers[0].outputFileSystem.should.be.exactly("foo");113 env.compilers[1].outputFileSystem.should.be.exactly("foo");114 });115 });116 describe("inputFileSystem", function() {117 beforeEach(function() {118 env.compilers = [createCompiler(), createCompiler()];119 env.myMultiCompiler = new MultiCompiler(env.compilers);120 });121 it("throws an error when reading the value", function() {122 should(function() {123 env.myMultiCompiler.inputFileSystem124 }).throw("Cannot read inputFileSystem of a MultiCompiler");125 });126 it("updates all compilers when setting the value", function() {127 env.myMultiCompiler.inputFileSystem = "foo";128 env.compilers[0].inputFileSystem.should.be.exactly("foo");129 env.compilers[1].inputFileSystem.should.be.exactly("foo");130 });131 });132 describe("outputPath", function() {133 describe("when common path cannot be found and output path is absolute", function() {134 beforeEach(function() {135 env.compilers = [136 createCompiler({137 outputPath: "/foo/bar"138 }),139 createCompiler({140 outputPath: "quux"141 })142 ];143 env.myMultiCompiler = new MultiCompiler(env.compilers);144 });145 it("returns the root path", function() {146 env.myMultiCompiler.outputPath.should.be.exactly("/");147 });148 });149 describe("when common path cannot be found and output path is relative", function() {150 beforeEach(function() {151 env.compilers = [152 createCompiler({153 outputPath: "foo/bar/baz"154 }),155 createCompiler({156 outputPath: "quux"157 })158 ];159 env.myMultiCompiler = new MultiCompiler(env.compilers);160 });161 it("returns the first segment of relative path", function() {162 env.myMultiCompiler.outputPath.should.be.exactly("foo");163 });164 });165 describe("when common path can be found and output path is absolute", function() {166 beforeEach(function() {167 env.compilers = [168 createCompiler({169 outputPath: "/foo"170 }),171 createCompiler({172 outputPath: "/foo/bar/baz"173 })174 ];175 env.myMultiCompiler = new MultiCompiler(env.compilers);176 });177 it("returns the shared path", function() {178 env.myMultiCompiler.outputPath.should.be.exactly("/foo");179 });180 });181 describe("when common path can be found and output path is relative", function() {182 beforeEach(function() {183 env.compilers = [184 createCompiler({185 outputPath: "foo"186 }),187 createCompiler({188 outputPath: "foo/bar/baz"189 })190 ];191 env.myMultiCompiler = new MultiCompiler(env.compilers);192 });193 it("returns the shared path", function() {194 env.myMultiCompiler.outputPath.should.be.exactly("foo");195 });196 });197 });198 });199 describe("compiler events", function() {200 beforeEach(function() {201 setupTwoCompilerEnvironment(env);202 });203 it("binds two event handler", function() {204 env.compiler1EventBindings.length.should.be.exactly(2);205 env.compiler2EventBindings.length.should.be.exactly(2);206 });207 describe("done handler", function() {208 beforeEach(function() {209 env.doneEventBinding1 = env.compiler1EventBindings[0];210 env.doneEventBinding2 = env.compiler2EventBindings[0];211 });212 it("binds to done event", function() {213 env.doneEventBinding1.name.should.be.exactly("done");214 });215 describe('when called for first compiler', function() {216 beforeEach(function() {217 env.mockDonePlugin = sinon.spy();218 env.myMultiCompiler.plugin('done', env.mockDonePlugin);219 env.doneEventBinding1.handler({220 hash: "foo"221 });222 });223 it("does not call the done plugin when not all compilers are finished", function() {224 env.mockDonePlugin.callCount.should.be.exactly(0);225 });226 describe('and called for second compiler', function() {227 beforeEach(function() {228 env.doneEventBinding2.handler({229 hash: "bar"230 });231 });232 it("calls the done plugin", function() {233 env.mockDonePlugin.callCount.should.be.exactly(1);234 });235 });236 });237 });238 describe("invalid handler", function() {239 beforeEach(function() {240 env.invalidEventBinding = env.compiler1EventBindings[1];241 });242 it("binds to invalid event", function() {243 env.invalidEventBinding.name.should.be.exactly("invalid");244 });245 describe('when called', function() {246 beforeEach(function() {247 env.mockInvalidPlugin = sinon.spy();248 env.myMultiCompiler.plugin('invalid', env.mockInvalidPlugin);249 env.invalidEventBinding.handler();250 });251 it("calls the invalid plugin", function() {252 env.mockInvalidPlugin.callCount.should.be.exactly(1);253 });254 });255 });256 });257 });258 describe("watch", function() {259 describe("without compiler dependencies", function() {260 beforeEach(function() {261 setupTwoCompilerEnvironment(env);262 env.callback = sinon.spy();263 env.options = {264 testWatchOptions: true265 };266 env.result = env.myMultiCompiler.watch(env.options, env.callback);267 });268 it("returns a multi-watching object", function() {269 var result = JSON.stringify(env.result);270 result.should.be.exactly('{"watchings":["compiler1","compiler2"]}');271 });272 it("calls watch on each compiler with original options", function() {273 env.compiler1WatchCallbacks.length.should.be.exactly(1);274 env.compiler1WatchCallbacks[0].options.should.be.exactly(env.options);275 env.compiler2WatchCallbacks.length.should.be.exactly(1);276 env.compiler2WatchCallbacks[0].options.should.be.exactly(env.options);277 });278 it("calls the callback when all compilers watch", function() {279 env.compiler1WatchCallbacks[0].callback(null, {280 hash: 'foo'281 });282 env.callback.callCount.should.be.exactly(0);283 env.compiler2WatchCallbacks[0].callback(null, {284 hash: 'bar'285 });286 env.callback.callCount.should.be.exactly(1);287 });288 describe("on first run", function() {289 describe("callback called with no compiler errors", function() {290 beforeEach(function() {291 env.compiler1WatchCallbacks[0].callback(new Error('Test error'));292 });293 it('has failure parameters', function() {294 env.callback.callCount.should.be.exactly(1);295 env.callback.getCall(0).args[0].should.be.Error();296 should(env.callback.getCall(0).args[1]).be.undefined();297 });298 });299 describe("callback called with no compiler errors", function() {300 beforeEach(function() {301 env.compiler1WatchCallbacks[0].callback(null, {302 hash: 'foo'303 });304 });305 it('does not call the callback', function() {306 env.callback.callCount.should.be.exactly(0);307 });308 });309 });310 describe("on subsequent runs", function() {311 describe("callback called with compiler errors", function() {312 beforeEach(function() {313 env.compiler1WatchCallbacks[0].callback(null, {314 hash: 'foo'315 });316 env.compiler2WatchCallbacks[0].callback(new Error('Test error'));317 });318 it('has failure parameters', function() {319 env.callback.callCount.should.be.exactly(1);320 env.callback.getCall(0).args[0].should.be.Error();321 should(env.callback.getCall(0).args[1]).be.undefined();322 });323 });324 describe("callback called with no compiler errors", function() {325 beforeEach(function() {326 env.compiler1WatchCallbacks[0].callback(null, {327 hash: 'foo'328 });329 env.compiler2WatchCallbacks[0].callback(null, {330 hash: 'bar'331 });332 });333 it('has success parameters', function() {334 env.callback.callCount.should.be.exactly(1);335 should(env.callback.getCall(0).args[0]).be.Null();336 var stats = JSON.stringify(env.callback.getCall(0).args[1]);337 stats.should.be.exactly('{"stats":[{"hash":"foo"},{"hash":"bar"}],"hash":"foobar"}');338 });339 });340 });341 });342 describe("with compiler dependencies", function() {343 beforeEach(function() {344 setupTwoCompilerEnvironment(env, {345 name: "compiler1",346 dependencies: ["compiler2"]347 }, {348 name: "compiler2"349 });350 env.callback = sinon.spy();351 env.options = {352 testWatchOptions: true353 };354 env.result = env.myMultiCompiler.watch(env.options, env.callback);355 });356 it("calls run on each compiler in dependency order", function() {357 env.compiler1WatchCallbacks.length.should.be.exactly(0);358 env.compiler2WatchCallbacks.length.should.be.exactly(1);359 env.compiler2WatchCallbacks[0].options.should.be.exactly(env.options);360 env.compiler2WatchCallbacks[0].callback(null, {361 hash: 'bar'362 });363 env.compiler1WatchCallbacks.length.should.be.exactly(1);364 env.compiler1WatchCallbacks[0].options.should.be.exactly(env.options);365 });366 it("calls the callback when all compilers run in dependency order", function() {367 env.compiler2WatchCallbacks[0].callback(null, {368 hash: 'bar'369 });370 env.callback.callCount.should.be.exactly(0);371 env.compiler1WatchCallbacks[0].callback(null, {372 hash: 'foo'373 });374 env.callback.callCount.should.be.exactly(1);375 });376 });377 });378 describe("run", function() {379 describe("without compiler dependencies", function() {380 beforeEach(function() {381 setupTwoCompilerEnvironment(env);382 env.callback = sinon.spy();383 env.myMultiCompiler.run(env.callback);384 });385 it("calls run on each compiler", function() {386 env.compiler1RunCallbacks.length.should.be.exactly(1);387 env.compiler2RunCallbacks.length.should.be.exactly(1);388 });389 it("calls the callback when all compilers run", function() {390 env.compiler1RunCallbacks[0].callback(null, {391 hash: 'foo'392 });393 env.callback.callCount.should.be.exactly(0);394 env.compiler2RunCallbacks[0].callback(null, {395 hash: 'bar'396 });397 env.callback.callCount.should.be.exactly(1);398 });399 describe("callback called with no compiler errors", function() {400 beforeEach(function() {401 env.compiler1RunCallbacks[0].callback(null, {402 hash: 'foo'403 });404 env.compiler2RunCallbacks[0].callback(null, {405 hash: 'bar'406 });407 });408 it('has success parameters', function() {409 env.callback.callCount.should.be.exactly(1);410 should(env.callback.getCall(0).args[0]).be.Null();411 var stats = JSON.stringify(env.callback.getCall(0).args[1]);412 stats.should.be.exactly('{"stats":[{"hash":"foo"},{"hash":"bar"}],"hash":"foobar"}');413 });414 });415 describe("callback called with compiler errors", function() {416 beforeEach(function() {417 env.compiler1RunCallbacks[0].callback(null, {418 hash: 'foo'419 });420 env.compiler2RunCallbacks[0].callback(new Error('Test error'));421 });422 it('has failure parameters', function() {423 env.callback.callCount.should.be.exactly(1);424 env.callback.getCall(0).args[0].should.be.Error();425 should(env.callback.getCall(0).args[1]).be.undefined();426 });427 });428 });429 describe("with compiler dependencies", function() {430 beforeEach(function() {431 setupTwoCompilerEnvironment(env, {432 name: "compiler1",433 dependencies: ["compiler2"]434 }, {435 name: "compiler2"436 });437 env.callback = sinon.spy();438 env.myMultiCompiler.run(env.callback);439 });440 it("calls run on each compiler in dependency order", function() {441 env.compiler1RunCallbacks.length.should.be.exactly(0);442 env.compiler2RunCallbacks.length.should.be.exactly(1);443 env.compiler2RunCallbacks[0].callback(null, {444 hash: 'bar'445 });446 env.compiler1RunCallbacks.length.should.be.exactly(1);447 });448 it("calls the callback when all compilers run in dependency order", function() {449 env.compiler2RunCallbacks[0].callback(null, {450 hash: 'bar'451 });452 env.callback.callCount.should.be.exactly(0);453 env.compiler1RunCallbacks[0].callback(null, {454 hash: 'foo'455 });456 env.callback.callCount.should.be.exactly(1);457 });458 });459 });460 describe("purgeInputFileSystem", function() {461 beforeEach(function() {462 env.compilers = [463 Object.assign({464 inputFileSystem: {465 purge: sinon.spy()466 }467 }, createCompiler()),468 createCompiler()469 ];470 env.myMultiCompiler = new MultiCompiler(env.compilers);471 env.myMultiCompiler.purgeInputFileSystem();472 });473 it("calls the compilers purge if available", function() {474 var purgeSpy = env.compilers[0].inputFileSystem.purge;475 purgeSpy.callCount.should.be.exactly(1);476 });477 });...
watch.spec.js
Source:watch.spec.js
...5const configBasic = require('./configs/basic');6const configSyntaxError = require('./configs/syntax-error');7afterEach(() => createCompiler.teardown());8it('should call the handler everytime a file changes', (done) => {9 const compiler = createCompiler(configBasic);10 let callsCount = 0;11 compiler.watch((err, { stats, duration }) => {12 expect(err).toBe(null);13 expect(stats.toJson().assetsByChunkName).toEqual({ main: 'app.js' });14 expect(typeof duration).toBe('number');15 callsCount += 1;16 if (callsCount === 2) {17 done();18 } else {19 setTimeout(() => touchFile(configBasic.entry), 150);20 }21 });22});23it('should fail if the compiler fails', (done) => {24 const compiler = createCompiler(configSyntaxError);25 compiler.watch((err, compilation) => {26 expect(err instanceof Error).toBe(true);27 expect(compilation).toBe(null);28 done();29 });30});31it('should fail if there\'s a fatal error', (done) => {32 const compiler = createCompiler(configBasic);33 const contrivedError = new Error('foo');34 compiler.addHook('watchRun', 'tapAsync', (compiler, callback) => callback(contrivedError));35 compiler.watch((err) => {36 expect(err).toBe(contrivedError);37 done();38 });39});40it('should output assets', (done) => {41 const compiler = createCompiler(configBasic);42 compiler.watch(() => {43 expect(fs.existsSync(`${compiler.webpackConfig.output.path}/app.js`)).toBe(true);44 done();45 });46});47describe('invalidate', () => {48 it('should return a function that can be used to invalidate and retrigger a compilation', (done) => {49 const compiler = createCompiler(configBasic);50 const logEvent = jest.fn();51 compiler.once('begin', () => setImmediate(() => invalidate()));52 compiler.on('begin', () => logEvent('begin'));53 compiler.on('invalidate', () => logEvent('invalidate'));54 compiler.on('end', () => logEvent('end'));55 const invalidate = compiler.watch(() => {56 const loggedEvents = logEvent.mock.calls.reduce((results, [event]) => [...results, event], []);57 expect(loggedEvents).toEqual(['begin', 'invalidate', 'begin', 'end']);58 done();59 });60 });61 it('should be a noop if the watcher is no longer active', async () => {62 const compiler = createCompiler(configBasic);63 const invalidate = compiler.watch(() => {});64 await compiler65 .on('error', () => {})66 .unwatch();67 expect(() => invalidate()).not.toThrow();68 });69});70describe('args', () => {71 it('should work with .watch()', (done) => {72 const compiler = createCompiler(configBasic);73 compiler74 .on('end', () => done())75 .on('error', (err) => done.fail(err))76 .watch();77 });78 it('should work with .watch(options)', (done) => {79 const compiler = createCompiler(configBasic);80 compiler81 .on('end', () => done())82 .on('error', (err) => done.fail(err))83 .watch({ poll: true });84 });85 it('should work with .watch(options, handler)', (done) => {86 const compiler = createCompiler(configBasic);87 compiler.watch({}, (err) => {88 if (err) {89 done.fail(err);90 } else {91 done();92 }93 });94 });95 it('should work with .watch(handler)', (done) => {96 const compiler = createCompiler(configBasic);97 compiler.watch((err) => {98 if (err) {99 done.fail(err);100 } else {101 done();102 }103 });104 });105 it('should throw if not idle', () => {106 const compiler = createCompiler(configBasic);107 compiler.watch();108 expect(() => compiler.run()).toThrow(/\bidle\b/);109 expect(() => compiler.watch()).toThrow(/\bidle\b/);110 });...
demo01.js
Source:demo01.js
...27 render: 'code.render',28 staticRenderFns: 'code.staticRenderFns'29 };30});31const { compileToFunctions } = createCompiler();32// ç®æ ï¼ éè¿compileToFunctions å°æ¨¡æ¿ç¼è¯ä¸ºrenderå½æ°33// {render, staticRenderFns} = compileToFunctions(compile)34// createCompiler ä¸çcompileæ¹æ³ä¼æ§è¡baseCompile,并å°æ¹æ¹æ³ä¼ éç» compileToFunctions(compile)35// createCompiler -> createCompilerCreator(baseCompile)36// compileToFunctions -> createCompiler(template,options)37// æç»çæ§è¡é»è¾ï¼...
Using AI Code Generation
1const { createCompiler } = require('@storybook/core/server');2const webpackConfig = require('./webpack.config.js');3const configDir = __dirname;4const configType = 'DEVELOPMENT';5const options = {6 babelOptions: {},7 refs: {},8 features: {},9};10const compiler = createCompiler({ webpackConfig, options });11const devServer = new WebpackDevServer(compiler, {12 headers: { 'Access-Control-Allow-Origin': '*' },13});14devServer.listen(9001, 'localhost', () => {15 console.log('Storybook started on port 9001');16});17const devServer = new WebpackDevServer(compiler, {18 headers: { 'Access-Control-Allow-Origin': '*' },19});20devServer.listen(9001, 'localhost', () => {21 console.log('Storybook started on port 9001');22});
Using AI Code Generation
1const { createCompiler } = require('storybook-root-configuration');2const compiler = createCompiler();3const { createCompiler } = require('storybook-root-configuration');4const compiler = createCompiler();5const { createCompiler } = require('storybook-root-configuration');6const compiler = createCompiler();7const { createCompiler } = require('storybook-root-configuration');8const compiler = createCompiler();9const { createCompiler } = require('storybook-root-configuration');10const compiler = createCompiler();11const { createCompiler } = require('storybook-root-configuration');12const compiler = createCompiler();13const { createCompiler } = require('storybook-root-configuration');14const compiler = createCompiler();15const { createCompiler } = require('storybook-root-configuration');16const compiler = createCompiler();17const { createCompiler } = require('storybook-root-configuration');18const compiler = createCompiler();
Using AI Code Generation
1module.exports = {2 stories: ['../src/**/*.stories.@(js|jsx|ts|tsx)'],3 core: {4 },5};6module.exports = async ({ config, mode }) => {7 config.module.rules.push({8 });9 return config;10};11import { addDecorator } from '@storybook/react';12import { withPostcss } from 'storybook-addon-postcss';13import { withA11y } from '@storybook/addon-a11y';14addDecorator(withPostcss);15addDecorator(withA11y);16 window.STORYBOOK_REACT_CLASSES = {};17 const storybookClasses = window.STORYBOOK_REACT_CLASSES;18 window.STORYBOOK_REACT_CLASSES = {};19 document.body.addEventListener('DOMNodeInserted', (event) => {20 if (event.target instanceof HTMLElement) {21 if (event.target.classList.contains('sb-show-main')) {22 const storyId = event.target.id;23 const story = storybookClasses[storyId];24 if (story) {25 const { kind, name } = story;26 const storyId = `${kind}--${name}`;27 const storyUrl = `${window.location.origin}${window.location.pathname}?path=/story/${storyId}`;28 console.log(storyUrl);29 }30 }31 }32 });33import { addons } from '@storybook/addons';34import { themes } from '@storybook/theming';35addons.setConfig({36});37 window.STORYBOOK_REACT_CLASSES = {};38 const storybookClasses = window.STORYBOOK_REACT_CLASSES;39 window.STORYBOOK_REACT_CLASSES = {};40 document.body.addEventListener('DOMNodeInserted', (event) => {41 if (
Using AI Code Generation
1const compiler = createCompiler({2 packageJson: require('../package.json'),3 presets: [require.resolve('@storybook/preset-create-react-app')],4 babelOptions: {5 require.resolve('@babel/preset-react'),6 require.resolve('@babel/preset-env'),7 require.resolve('@babel/preset-typescript'),8 },9 typescriptOptions: {10 checkOptions: {},11 reactDocgenTypescriptOptions: {12 propFilter: (prop) => (prop.parent ? !/node_modules/.test(prop.parent.fileName) : true),13 },14 },15});
Using AI Code Generation
1const { createCompiler } = require('@storybook/addon-docs/mdx-compiler-plugin');2const compiler = createCompiler({});3const result = compiler.processSync('some mdx string');4console.log(result.contents);5const result = compiler.processSync('some mdx string', {6});7console.log(result.contents);8import { addParameters, configure } from '@storybook/react';9import { DocsPage, DocsContainer } from '@storybook/addon-docs/blocks';10addParameters({11 docs: {12 },13});14addParameters({15 docs: {16 },17});18export default {19 parameters: {20 docs: {21 },22 },23};24export default {25 parameters: {26 docs: {27 },28 },29};30Button.story = {31 parameters: {32 docs: {33 },34 },35};36export const Primary = () => <Button>Primary</Button>;37Primary.parameters = {38 docs: {39 },40};
Using AI Code Generation
1const path = require('path');2const { createCompiler } = require('storybook-root-cause');3const { parse } = require('@babel/parser');4const traverse = require('@babel/traverse').default;5const { transformFromAstSync } = require('@babel/core');6const fs = require('fs');7const compiler = createCompiler({8 tsConfigPath: path.resolve(__dirname, 'tsconfig.json'),9 webpackConfigPath: path.resolve(__dirname, 'webpack.config.js'),10});11const result = compiler.compile(12 path.resolve(__dirname, 'test.tsx')13);14const ast = parse(result, {15});16traverse(ast, {17 enter(path) {18 if (path.isIdentifier({ name: 'Button' })) {19 path.node.name = 'CustomButton';20 }21 },22});23const { code } = transformFromAstSync(ast, result, {24});25console.log(code);26fs.writeFileSync(path.resolve(__dirname, 'test2.tsx'), code);
Automation Testing Tutorials
Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.
LambdaTest Learning Hubs:
- JUnit Tutorial
- TestNG Tutorial
- Webdriver Tutorial
- WebDriverIO Tutorial
- Protractor Tutorial
- Selenium 4 Tutorial
- Jenkins Tutorial
- NUnit Tutorial
- Jest Tutorial
- Playwright Tutorial
- Cypress Tutorial
- PyTest Tutorial
YouTube
You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.
Run storybook-root automation tests on LambdaTest cloud grid
Perform automation testing on 3000+ real desktop and mobile devices online.
Try LambdaTest Now !!
Get 100 minutes of automation test minutes FREE!!
Was this article helpful?
