Skip to content

Commit

Permalink
fix: workaround for infinite global decorators (#398)
Browse files Browse the repository at this point in the history
  • Loading branch information
@dannyhw
dannyhw authored Nov 17, 2022
1 parent 01a0f96 commit 40e10b6
Show file tree
Hide file tree
Showing 3 changed files with 47 additions and 12 deletions.
42 changes: 33 additions & 9 deletions app/react-native/scripts/__snapshots__/loader.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ exports[`loader writeRequires when there are different file extensions writes th
"
/* do not change this file, it is auto generated by storybook. */
import { configure, addDecorator, addParameters, addArgsEnhancer } from '@storybook/react-native';
import { configure, addDecorator, addParameters, addArgsEnhancer, clearDecorators } from '@storybook/react-native';
import \\"@storybook/addon-ondevice-notes/register\\";
import \\"@storybook/addon-ondevice-controls/register\\";
Expand All @@ -17,6 +17,14 @@ import \\"@storybook/addon-ondevice-actions/register\\";
import { decorators, parameters } from './preview';
if (decorators) {
if(__DEV__){
// stops the warning from showing on every HMR
require('react-native').LogBox.ignoreLogs([
'\`clearDecorators\` is deprecated and will be removed in Storybook 7.0',
]);
}
// workaround for global decorators getting infinitely applied on HMR, see https://github.com/storybookjs/react-native/issues/185
clearDecorators();
decorators.forEach((decorator) => addDecorator(decorator));
}
Expand All @@ -25,7 +33,7 @@ import \\"@storybook/addon-ondevice-actions/register\\";
}
// temporary fix for https://github.com/storybookjs/react-native/issues/327 whilst the issue is investigated
try {
argsEnhancers.forEach(enhancer => addArgsEnhancer(enhancer));
} catch{}
Expand All @@ -43,7 +51,7 @@ exports[`loader writeRequires when there is a story glob and exclude paths globs
"
/* do not change this file, it is auto generated by storybook. */
import { configure, addDecorator, addParameters, addArgsEnhancer } from '@storybook/react-native';
import { configure, addDecorator, addParameters, addArgsEnhancer, clearDecorators } from '@storybook/react-native';
import \\"@storybook/addon-ondevice-notes/register\\";
import \\"@storybook/addon-ondevice-controls/register\\";
Expand All @@ -56,6 +64,14 @@ import \\"@storybook/addon-ondevice-actions/register\\";
import { decorators, parameters } from './preview';
if (decorators) {
if(__DEV__){
// stops the warning from showing on every HMR
require('react-native').LogBox.ignoreLogs([
'\`clearDecorators\` is deprecated and will be removed in Storybook 7.0',
]);
}
// workaround for global decorators getting infinitely applied on HMR, see https://github.com/storybookjs/react-native/issues/185
clearDecorators();
decorators.forEach((decorator) => addDecorator(decorator));
}
Expand All @@ -64,7 +80,7 @@ import \\"@storybook/addon-ondevice-actions/register\\";
}
// temporary fix for https://github.com/storybookjs/react-native/issues/327 whilst the issue is investigated
try {
argsEnhancers.forEach(enhancer => addArgsEnhancer(enhancer));
} catch{}
Expand All @@ -82,7 +98,7 @@ exports[`loader writeRequires when there is a story glob writes the story import
"
/* do not change this file, it is auto generated by storybook. */
import { configure, addDecorator, addParameters, addArgsEnhancer } from '@storybook/react-native';
import { configure, addDecorator, addParameters, addArgsEnhancer, clearDecorators } from '@storybook/react-native';
import \\"@storybook/addon-ondevice-notes/register\\";
import \\"@storybook/addon-ondevice-controls/register\\";
Expand All @@ -95,6 +111,14 @@ import \\"@storybook/addon-ondevice-actions/register\\";
import { decorators, parameters } from './preview';
if (decorators) {
if(__DEV__){
// stops the warning from showing on every HMR
require('react-native').LogBox.ignoreLogs([
'\`clearDecorators\` is deprecated and will be removed in Storybook 7.0',
]);
}
// workaround for global decorators getting infinitely applied on HMR, see https://github.com/storybookjs/react-native/issues/185
clearDecorators();
decorators.forEach((decorator) => addDecorator(decorator));
}
Expand All @@ -103,7 +127,7 @@ import \\"@storybook/addon-ondevice-actions/register\\";
}
// temporary fix for https://github.com/storybookjs/react-native/issues/327 whilst the issue is investigated
try {
argsEnhancers.forEach(enhancer => addArgsEnhancer(enhancer));
} catch{}
Expand All @@ -121,7 +145,7 @@ exports[`loader writeRequires when there is no preview does not add preview rela
"
/* do not change this file, it is auto generated by storybook. */
import { configure, addDecorator, addParameters, addArgsEnhancer } from '@storybook/react-native';
import { configure, addDecorator, addParameters, addArgsEnhancer, clearDecorators } from '@storybook/react-native';
import \\"@storybook/addon-ondevice-notes/register\\";
import \\"@storybook/addon-ondevice-controls/register\\";
Expand All @@ -132,7 +156,7 @@ import \\"@storybook/addon-ondevice-actions/register\\";
// temporary fix for https://github.com/storybookjs/react-native/issues/327 whilst the issue is investigated
try {
argsEnhancers.forEach(enhancer => addArgsEnhancer(enhancer));
} catch{}
Expand All @@ -150,7 +174,7 @@ exports[`loader writeRequires when there is no story glob or addons writes no st
"
/* do not change this file, it is auto generated by storybook. */
import { configure, addDecorator, addParameters, addArgsEnhancer } from '@storybook/react-native';
import { configure, addDecorator, addParameters, addArgsEnhancer, clearDecorators } from '@storybook/react-native';
Expand Down
15 changes: 13 additions & 2 deletions app/react-native/scripts/loader.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,19 @@ const prettier = require('prettier');
const cwd = process.cwd();
const supportedExtensions = ['js', 'jsx', 'ts', 'tsx', 'cjs', 'mjs'];

// we clear decorators as a workaround for global decorators getting infinitely applied on HMR
const previewImports = `
import { decorators, parameters } from './preview';
if (decorators) {
if(__DEV__){
// stops the warning from showing on every HMR
require('react-native').LogBox.ignoreLogs([
'\`clearDecorators\` is deprecated and will be removed in Storybook 7.0',
]);
}
// workaround for global decorators getting infinitely applied on HMR, see https://github.com/storybookjs/react-native/issues/185
clearDecorators();
decorators.forEach((decorator) => addDecorator(decorator));
}
Expand Down Expand Up @@ -98,7 +107,9 @@ function writeRequires({ configPath, absolute = false }) {
if (main.addons.includes('@storybook/addon-ondevice-actions')) {
enhancersImport =
'import { argsEnhancers } from "@storybook/addon-actions/dist/modern/preset/addArgs"';
enhancers = `// temporary fix for https://github.com/storybookjs/react-native/issues/327 whilst the issue is investigated

// try/catch is a temporary fix for https://github.com/storybookjs/react-native/issues/327 until a fix is found
enhancers = `
try {
argsEnhancers.forEach(enhancer => addArgsEnhancer(enhancer));
} catch{}
Expand All @@ -108,7 +119,7 @@ function writeRequires({ configPath, absolute = false }) {
const fileContent = `
/* do not change this file, it is auto generated by storybook. */
import { configure, addDecorator, addParameters, addArgsEnhancer } from '@storybook/react-native';
import { configure, addDecorator, addParameters, addArgsEnhancer, clearDecorators } from '@storybook/react-native';
${registerAddons}
Expand Down
2 changes: 1 addition & 1 deletion examples/native/.storybook/preview.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,5 +28,5 @@ export const parameters = {
};

const styles = StyleSheet.create({
container: { /* padding: 8, */ flex: 1 },
container: { padding: 8, flex: 1 },
});

0 comments on commit 40e10b6

Please sign in to comment.