diff --git a/CHANGELOG.md b/CHANGELOG.md index 765cdbfa7d..3c31a09886 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,7 @@ | Version | Description | |---------|-------------| +| 1.8.30 | [PR#2464](https://github.com/bbc/psammead/pull/2464) Add more context to changeScanner error output | | 1.8.29 | [PR#2317](https://github.com/bbc/psammead/pull/2317) Bump @bbc/psammead-media-player | | 1.8.28 | [PR#2452](https://github.com/bbc/psammead/pull/2452) Bump dependencies (#2441 - #2445) | | 1.8.27 | [PR#2400](https://github.com/bbc/psammead/pull/2400) bump dependencies (#2385 - #2396) | diff --git a/package-lock.json b/package-lock.json index 1acb8b6d52..8a4ee53302 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@bbc/psammead", - "version": "1.8.29", + "version": "1.8.30", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index ff939c2e21..08ac3e314a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@bbc/psammead", - "version": "1.8.29", + "version": "1.8.30", "description": "Core Components Library Developed & Maintained By The Articles and Reach & Languages Team", "main": "index.js", "private": true, diff --git a/packages/components/psammead-image/CHANGELOG.md b/packages/components/psammead-image/CHANGELOG.md index 57079e46e2..9f95a83edf 100644 --- a/packages/components/psammead-image/CHANGELOG.md +++ b/packages/components/psammead-image/CHANGELOG.md @@ -3,6 +3,7 @@ | Version | Description | |---------|-------------| +| 1.2.3 | [PR#2460](https://github.com/bbc/psammead/pull/2460) Fix Storybook console errors | | 1.2.2 | [PR#1942](https://github.com/bbc/psammead/pull/1942) Talos - Bump React to 16.9.0 | | 1.2.1 | [PR#1803](https://github.com/bbc/psammead/pull/1803/) Patches broken links on badges in documentation | | 1.2.0 | [PR#1794](https://github.com/bbc/psammead/pull/1794) Add david dependency badges | diff --git a/packages/components/psammead-image/package-lock.json b/packages/components/psammead-image/package-lock.json index 7c157fa4bd..e58230f0e8 100644 --- a/packages/components/psammead-image/package-lock.json +++ b/packages/components/psammead-image/package-lock.json @@ -1,5 +1,5 @@ { "name": "@bbc/psammead-image", - "version": "1.2.2", + "version": "1.2.3", "lockfileVersion": 1 } diff --git a/packages/components/psammead-image/package.json b/packages/components/psammead-image/package.json index eb37cbec8d..79657c1fd2 100644 --- a/packages/components/psammead-image/package.json +++ b/packages/components/psammead-image/package.json @@ -1,6 +1,6 @@ { "name": "@bbc/psammead-image", - "version": "1.2.2", + "version": "1.2.3", "main": "dist/index.js", "module": "esm/index.js", "sideEffects": false, diff --git a/packages/components/psammead-image/src/index.amp.stories.jsx b/packages/components/psammead-image/src/index.amp.stories.jsx index c430a81f7b..23c44c4fb3 100644 --- a/packages/components/psammead-image/src/index.amp.stories.jsx +++ b/packages/components/psammead-image/src/index.amp.stories.jsx @@ -1,5 +1,5 @@ import AmpImg from './index.amp'; -import stories from './testHelpers/stories'; +import { stories } from './testHelpers/stories'; import { ampDecorator } from '../../../../.storybook/config'; const additionalProps = { diff --git a/packages/components/psammead-image/src/index.stories.jsx b/packages/components/psammead-image/src/index.stories.jsx index 64b9bc0e3c..e8932bfbf7 100644 --- a/packages/components/psammead-image/src/index.stories.jsx +++ b/packages/components/psammead-image/src/index.stories.jsx @@ -1,7 +1,7 @@ import React from 'react'; import { withKnobs } from '@storybook/addon-knobs'; import { Img } from '.'; -import stories, { getProps } from './testHelpers/stories'; +import { stories, getProps } from './testHelpers/stories'; import { landscape } from './testHelpers/fixtureData'; import notes from '../README.md'; diff --git a/packages/components/psammead-image/src/testHelpers/stories.jsx b/packages/components/psammead-image/src/testHelpers/stories.jsx index 4ca9ccd79f..026d2a66e6 100644 --- a/packages/components/psammead-image/src/testHelpers/stories.jsx +++ b/packages/components/psammead-image/src/testHelpers/stories.jsx @@ -18,7 +18,7 @@ export function getProps(image, includeHeight, type) { return props; } -const stories = ( +export const stories = ( Component, title, includeHeight = false, @@ -79,5 +79,3 @@ const stories = ( ), { notes }, ); - -export default stories; diff --git a/packages/components/psammead-sitewide-links/CHANGELOG.md b/packages/components/psammead-sitewide-links/CHANGELOG.md index 660844b945..93addeb45e 100644 --- a/packages/components/psammead-sitewide-links/CHANGELOG.md +++ b/packages/components/psammead-sitewide-links/CHANGELOG.md @@ -3,6 +3,7 @@ | Version | Description | |---------|-------------| +| 3.1.17 | [PR#2457](https://github.com/bbc/psammead/pull/2457) Show relevant link text when selecting service in storybook | | 3.1.16 | [PR#2440](https://github.com/bbc/psammead/pull/2440) Talos - Bump Dependencies - @bbc/psammead-styles | | 3.1.15 | [PR#2404](https://github.com/bbc/psammead/pull/2404) replace inputProvider and dirDecorator with withServicesInput | | 3.1.14 | [PR#2351](https://github.com/bbc/psammead/pull/2351) Fix styling for IE11 | diff --git a/packages/components/psammead-sitewide-links/package-lock.json b/packages/components/psammead-sitewide-links/package-lock.json index 55fd05aef4..a170a1a744 100644 --- a/packages/components/psammead-sitewide-links/package-lock.json +++ b/packages/components/psammead-sitewide-links/package-lock.json @@ -1,6 +1,6 @@ { "name": "@bbc/psammead-sitewide-links", - "version": "3.1.16", + "version": "3.1.17", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/packages/components/psammead-sitewide-links/package.json b/packages/components/psammead-sitewide-links/package.json index a65504f08a..b3889b43e7 100644 --- a/packages/components/psammead-sitewide-links/package.json +++ b/packages/components/psammead-sitewide-links/package.json @@ -1,6 +1,6 @@ { "name": "@bbc/psammead-sitewide-links", - "version": "3.1.16", + "version": "3.1.17", "description": "React styled component for a sitewide-links", "main": "dist/index.js", "module": "esm/index.js", diff --git a/packages/components/psammead-sitewide-links/src/index.stories.jsx b/packages/components/psammead-sitewide-links/src/index.stories.jsx index b817da8fa9..3c2cc79bc2 100644 --- a/packages/components/psammead-sitewide-links/src/index.stories.jsx +++ b/packages/components/psammead-sitewide-links/src/index.stories.jsx @@ -10,10 +10,11 @@ const buildLink = text => ({ href: 'https://www.bbc.co.uk/news', }); -const links = Array(7) - .fill() - .map((el, n) => `link ${n}`) - .map(buildLink); +const links = (text, service) => + Array(7) + .fill() + .map((el, n) => (service === 'news' ? `link ${n}` : `${text} ${n}`)) + .map(buildLink); storiesOf('Components|SitewideLinks', module) .addDecorator(withKnobs) @@ -22,7 +23,7 @@ storiesOf('Components|SitewideLinks', module) 'default', ({ text, service }) => ( | Version | Description | |---------|-------------| +| 8.0.0 | [PR#2453](https://github.com/bbc/psammead/pull/2453) ability to create RTL variants of all stories of a specific kind or specific stories of specific kind | | 7.0.1 | [PR#2436](https://github.com/bbc/psammead/pull/2436) Update chinese locales | | 7.0.0 | [PR#2404](https://github.com/bbc/psammead/pull/2404) replace inputProvider and dirDecorator with withServicesInput | | 6.2.0 | [PR#2407](https://github.com/bbc/psammead/pull/2407) adds buildRTLSubstories to create right-to-left variants of all stories | diff --git a/packages/utilities/psammead-storybook-helpers/README.md b/packages/utilities/psammead-storybook-helpers/README.md index 4e5e545dbd..2c35cf428a 100644 --- a/packages/utilities/psammead-storybook-helpers/README.md +++ b/packages/utilities/psammead-storybook-helpers/README.md @@ -22,7 +22,13 @@ The `withServicesKnob` function accepts an options argument with 2 properties: - `defaultService`(String): The default selected service of the services dropdown e.g. `arabic`. The default is `news`. - `services`(Array): A list of services that the dropdown will display. The default is all services. -`buildRTLSubstories` - a function that gets all stories and creates right-to-left variants as substories. Internally it uses the `withServicesKnob` to set the default service as `arabic`. The appropriate place to use this function is in `storybook/config.js`. +`buildRTLSubstories` - a function to create right-to-left variants of stories as substories. Internally it uses the `withServicesKnob` to set the default service as `arabic`. + +The `buildRTLSubstories` function accepts 2 arguments. + +- `storyKind`(String) - This is the story kind that you want you want to create RTL substories from. This will normally be the first argument you pass into `storiesOf` e.g. `storiesOf('Components|Paragraph', module)`. This parameter is required. +- `options`(Object) - Available options: + - `include`(Array) - A list of specific story names to create RTL substories of. If this is not provided then all stories will have RTL substories. ## Installation @@ -105,12 +111,19 @@ The above example dismisses the use of the `addDecorator` method and decorates t ### buildRTLSubstories ```jsx -// storybook/config.js +import { buildRTLSubstories } from '@bbc/psammead-storybook-helpers'; +// create RTL variants of all stories of a kind +buildRTLSubstories('Components|Paragraph'); +``` + +```jsx import { buildRTLSubstories } from '@bbc/psammead-storybook-helpers'; -// must be placed after the storybook configure function -buildRTLSubstories(); +// create RTL variants of specific stories of a kind +buildRTLSubstories('Components|Paragraph', { + include: ['containing an inline link'], +}); ``` ## Contributing diff --git a/packages/utilities/psammead-storybook-helpers/package-lock.json b/packages/utilities/psammead-storybook-helpers/package-lock.json index d8ad2d9b48..c398b59ecf 100644 --- a/packages/utilities/psammead-storybook-helpers/package-lock.json +++ b/packages/utilities/psammead-storybook-helpers/package-lock.json @@ -1,6 +1,6 @@ { "name": "@bbc/psammead-storybook-helpers", - "version": "7.0.1", + "version": "8.0.0", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/packages/utilities/psammead-storybook-helpers/package.json b/packages/utilities/psammead-storybook-helpers/package.json index faed0333e1..754d102730 100644 --- a/packages/utilities/psammead-storybook-helpers/package.json +++ b/packages/utilities/psammead-storybook-helpers/package.json @@ -1,6 +1,6 @@ { "name": "@bbc/psammead-storybook-helpers", - "version": "7.0.1", + "version": "8.0.0", "main": "dist/index.js", "module": "esm/index.js", "sideEffects": false, diff --git a/packages/utilities/psammead-storybook-helpers/src/buildRTLSubstories.js b/packages/utilities/psammead-storybook-helpers/src/buildRTLSubstories.js index 5da8c90e0c..3dd0354e31 100644 --- a/packages/utilities/psammead-storybook-helpers/src/buildRTLSubstories.js +++ b/packages/utilities/psammead-storybook-helpers/src/buildRTLSubstories.js @@ -1,12 +1,33 @@ import { getStorybook, storiesOf } from '@storybook/react'; import withServicesKnob from './withServicesKnob'; -export default () => { - getStorybook().forEach(({ kind, stories }) => { - stories.forEach(({ name, render }) => { - storiesOf(`${kind}/RTL`, module) - .addDecorator(withServicesKnob({ defaultService: 'arabic' })) - .add(`RTL - ${name}`, render); - }); +const matchesStoryKind = kind => story => story.kind === kind; + +const matchesStoryName = name => story => story.name === name; + +const buildRTLSubstory = (kind, name, storyFn) => { + const rtlServiceDecorator = withServicesKnob({ + defaultService: 'arabic', + services: ['arabic', 'persian', 'urdu', 'pashto'], }); + storiesOf(`${kind}/RTL`, module).add(`RTL - ${name}`, () => + rtlServiceDecorator(storyFn), + ); +}; + +// eslint-disable-next-line import/prefer-default-export +export const buildRTLSubstories = (storyKind = '', { include = [] } = {}) => { + const allStories = getStorybook(); + const { stories } = allStories.find(matchesStoryKind(storyKind)); + + if (include.length) { + include.forEach(name => { + const { render } = stories.find(matchesStoryName(name)); + buildRTLSubstory(storyKind, name, render); + }); + } else { + stories.forEach(({ name, render }) => + buildRTLSubstory(storyKind, name, render), + ); + } }; diff --git a/packages/utilities/psammead-storybook-helpers/src/buildRTLSubstories.test.js b/packages/utilities/psammead-storybook-helpers/src/buildRTLSubstories.test.js index ef03375c1f..f35ed51f47 100644 --- a/packages/utilities/psammead-storybook-helpers/src/buildRTLSubstories.test.js +++ b/packages/utilities/psammead-storybook-helpers/src/buildRTLSubstories.test.js @@ -1,15 +1,14 @@ import { getStorybook, storiesOf } from '@storybook/react'; -import buildRTLSubstories from './buildRTLSubstories'; +import { buildRTLSubstories } from './buildRTLSubstories'; import * as withServicesKnob from './withServicesKnob'; const mockAddStory = jest.fn(); -const mockAddDecorator = jest.fn(() => ({ add: mockAddStory })); withServicesKnob.default = jest.fn(() => 'withServicesKnob'); jest.mock('@storybook/react', () => ({ storiesOf: jest.fn(() => ({ - addDecorator: mockAddDecorator, + add: mockAddStory, })), getStorybook: jest.fn(() => [ { @@ -42,34 +41,45 @@ jest.mock('@storybook/react', () => ({ ]), })); -buildRTLSubstories(); +afterEach(jest.clearAllMocks); it('should get all stories', () => { + buildRTLSubstories('Components|Brand'); + expect(getStorybook).toHaveBeenCalled(); }); -it('should add the withServicesKnob decorator', () => { +it('should add the withServicesKnob decorator so that the default service and service options are configured', () => { + buildRTLSubstories('Components|Brand'); + expect(withServicesKnob.default).toHaveBeenCalledWith({ defaultService: 'arabic', + services: ['arabic', 'persian', 'urdu', 'pashto'], }); - expect(mockAddDecorator).toHaveBeenCalledWith('withServicesKnob'); }); -it('should create the substories', () => { +it("should build RTL variants of story kind's full suite of stories", () => { + buildRTLSubstories('Components|Brand'); + expect(storiesOf.mock.calls[0][0]).toEqual('Components|Brand/RTL'); expect(mockAddStory.mock.calls[0][0]).toEqual('RTL - without brand link'); expect(storiesOf.mock.calls[1][0]).toEqual('Components|Brand/RTL'); expect(mockAddStory.mock.calls[1][0]).toEqual('RTL - with brand link'); - expect(storiesOf.mock.calls[2][0]).toEqual('Components|Caption/RTL'); - expect(mockAddStory.mock.calls[2][0]).toEqual('RTL - default'); + expect(mockAddStory.mock.calls[2]).toBeUndefined(); +}); + +it("should build RTL variants of story kind's specified stories", () => { + buildRTLSubstories('Components|Brand', { include: ['with brand link'] }); + + expect(storiesOf.mock.calls[0][0]).toEqual('Components|Brand/RTL'); + expect(mockAddStory.mock.calls[0][0]).toEqual('RTL - with brand link'); - expect(storiesOf.mock.calls[3][0]).toEqual('Components|Caption/RTL'); - expect(mockAddStory.mock.calls[3][0]).toEqual('RTL - with offscreen text'); + expect(storiesOf.mock.calls[1]).toBeUndefined(); +}); - expect(storiesOf.mock.calls[4][0]).toEqual('Components|Caption/RTL'); - expect(mockAddStory.mock.calls[4][0]).toEqual( - 'RTL - containing an inline link', - ); +it('should not create RTL substories when no params', () => { + expect(() => buildRTLSubstories()).toThrow(); + expect(mockAddStory).not.toHaveBeenCalled(); }); diff --git a/packages/utilities/psammead-storybook-helpers/src/index.js b/packages/utilities/psammead-storybook-helpers/src/index.js index b5645f895a..314023b59b 100644 --- a/packages/utilities/psammead-storybook-helpers/src/index.js +++ b/packages/utilities/psammead-storybook-helpers/src/index.js @@ -1,5 +1,5 @@ import withServicesKnob from './withServicesKnob'; -import buildRTLSubstories from './buildRTLSubstories'; +import { buildRTLSubstories } from './buildRTLSubstories'; import LANGUAGE_VARIANTS from './text-variants'; export { LANGUAGE_VARIANTS, withServicesKnob, buildRTLSubstories }; diff --git a/scripts/changeScanner/index.js b/scripts/changeScanner/index.js index 2e4a7bcd17..7e65f9e717 100644 --- a/scripts/changeScanner/index.js +++ b/scripts/changeScanner/index.js @@ -18,6 +18,9 @@ Object.keys(changes).forEach(packageName => { /* eslint-disable no-console */ if (errors.length > 0) { + console.error(`Please update the version number and CHANGELOG for every package that is being +changed in this branch. The following problems were found: +`); errors.forEach(error => console.error(chalk.red(error))); console.error(''); // empty line for spacing process.exit(1); diff --git a/scripts/changeScanner/index.test.js b/scripts/changeScanner/index.test.js index 002431384c..7ecf35f10a 100644 --- a/scripts/changeScanner/index.test.js +++ b/scripts/changeScanner/index.test.js @@ -69,9 +69,13 @@ describe(`changeScanner - index`, () => { '', // empty line for spacing ]; - expect(consoleLogOutput).not.toHaveBeenCalled(); + expect(consoleErrorOutput).toHaveBeenCalledTimes( + expectedMessages.length + 1, + ); - expect(consoleErrorOutput).toHaveBeenCalledTimes(expectedMessages.length); + expect(consoleErrorOutput).toHaveBeenCalledWith( + expect.stringContaining('Please update the version number'), + ); expectedMessages.forEach(msg => expect(consoleErrorOutput).toHaveBeenCalledWith(msg),