Merge branch 'master' into feature/theming

addons/notes/README.md

@@ -1,5 +1,4 @@
 # Storybook Addon Notes
-
 [![Build Status on CircleCI](https://circleci.com/gh/storybooks/storybook.svg?style=shield)](https://circleci.com/gh/storybooks/storybook)
 [![CodeFactor](https://www.codefactor.io/repository/github/storybooks/storybook/badge)](https://www.codefactor.io/repository/github/storybooks/storybook)
 [![Known Vulnerabilities](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847/badge.svg)](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847)
@@ -16,6 +15,7 @@ Storybook Addon Notes allows you to write notes (text or HTML) for your stories
 ![Storybook Addon Notes Demo](docs/demo.png)
 
 ### Getting Started
+**NOTE: Documentation on master branch is for alpha version, stable release is on [release/3.4](https://github.com/storybooks/storybook/tree/release/3.4/addons/)**
 
 ```sh
 yarn add -D @storybook/addon-notes

addons/storysource/package.json

@@ -25,7 +25,7 @@
     "babel-runtime": "^6.26.0",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.1.0",
-    "prettier": "~1.12.1",
+    "prettier": "^1.13.3",
     "prop-types": "^15.6.1",
     "react-syntax-highlighter": "^7.0.4"
   },

addons/storysource/src/loader/generate-helpers.js

@@ -27,14 +27,26 @@ function generateSourceWithoutUglyComments(source, { comments, uglyCommentsRegex
   return parts.join('');
 }
 
-function prettifyCode(source, { prettierConfig, parser }) {
+function prettifyCode(source, { prettierConfig, parser, filepath }) {
   let config = prettierConfig;
 
-  if (!config.parser && parser && parser !== 'javascript') {
-    config = {
-      ...prettierConfig,
-      parser,
-    };
+  if (!config.parser) {
+    if (parser) {
+      config = {
+        ...prettierConfig,
+        parser: parser === 'javascript' ? 'babylon' : parser,
+      };
+    } else if (filepath) {
+      config = {
+        ...prettierConfig,
+        filepath,
+      };
+    } else {
+      config = {
+        ...prettierConfig,
+        parser: 'babylon',
+      };
+    }
   }
 
   return prettier.format(source, config);

addons/storysource/src/loader/index.js

@@ -5,7 +5,7 @@ const ADD_DECORATOR_STATEMENT = '.addDecorator(withStorySource(__STORY__, __ADDS
 
 function transform(source) {
   const options = getOptions(this) || {};
-  const result = injectDecorator(source, ADD_DECORATOR_STATEMENT, options);
+  const result = injectDecorator(source, ADD_DECORATOR_STATEMENT, this.resourcePath, options);
 
   if (!result.changed) {
     return source;

addons/storysource/src/loader/inject-decorator.js

@@ -6,16 +6,17 @@ import {
   generateAddsMap,
 } from './generate-helpers';
 
-function extendOptions(source, comments, options) {
+function extendOptions(source, comments, filepath, options) {
   return {
     ...defaultOptions,
     ...options,
     source,
     comments,
+    filepath,
   };
 }
 
-function inject(source, decorator, options = {}) {
+function inject(source, decorator, filepath, options = {}) {
   const { changed, source: newSource, comments } = generateSourceWithDecorators(
     source,
     decorator,
@@ -30,7 +31,7 @@ function inject(source, decorator, options = {}) {
     };
   }
 
-  const storySource = generateStorySource(extendOptions(source, comments, options));
+  const storySource = generateStorySource(extendOptions(source, comments, filepath, options));
   const addsMap = generateAddsMap(storySource, options.parser);
 
   return {

addons/storysource/src/loader/inject-decorator.test.js

@@ -1,12 +1,19 @@
 import fs from 'fs';
+import path from 'path';
 import injectDecorator from './inject-decorator';
 
 const ADD_DECORATOR_STATEMENT = '.addDecorator(withStorySource(__STORY__, __ADDS_MAP__))';
 
 describe('inject-decorator', () => {
   describe('positive', () => {
-    const source = fs.readFileSync('./__mocks__/inject-decorator.stories.txt', 'utf-8');
-    const result = injectDecorator(source, ADD_DECORATOR_STATEMENT);
+    const mockFilePath = './__mocks__/inject-decorator.stories.txt';
+    const source = fs.readFileSync(mockFilePath, 'utf-8');
+    const result = injectDecorator(
+      source,
+      ADD_DECORATOR_STATEMENT,
+      path.resolve(__dirname, mockFilePath),
+      { parser: 'javascript' }
+    );
 
     it('returns "changed" flag', () => {
       expect(result.changed).toBeTruthy();
@@ -22,8 +29,14 @@ describe('inject-decorator', () => {
   });
 
   describe('positive - angular', () => {
-    const source = fs.readFileSync('./__mocks__/inject-decorator.angular-stories.txt', 'utf-8');
-    const result = injectDecorator(source, ADD_DECORATOR_STATEMENT, { parser: 'typescript' });
+    const mockFilePath = './__mocks__/inject-decorator.angular-stories.txt';
+    const source = fs.readFileSync(mockFilePath, 'utf-8');
+    const result = injectDecorator(
+      source,
+      ADD_DECORATOR_STATEMENT,
+      path.resolve(__dirname, mockFilePath),
+      { parser: 'typescript' }
+    );
 
     it('returns "changed" flag', () => {
       expect(result.changed).toBeTruthy();
@@ -39,8 +52,14 @@ describe('inject-decorator', () => {
   });
 
   describe('positive - ts', () => {
-    const source = fs.readFileSync('./__mocks__/inject-decorator.ts.txt', 'utf-8');
-    const result = injectDecorator(source, ADD_DECORATOR_STATEMENT, { parser: 'typescript' });
+    const mockFilePath = './__mocks__/inject-decorator.ts.txt';
+    const source = fs.readFileSync(mockFilePath, 'utf-8');
+    const result = injectDecorator(
+      source,
+      ADD_DECORATOR_STATEMENT,
+      path.resolve(__dirname, mockFilePath),
+      { parser: 'typescript' }
+    );
 
     it('returns "changed" flag', () => {
       expect(result.changed).toBeTruthy();
@@ -56,11 +75,14 @@ describe('inject-decorator', () => {
   });
 
   describe('stories with ugly comments', () => {
-    const source = fs.readFileSync(
-      './__mocks__/inject-decorator.ugly-comments-stories.txt',
-      'utf-8'
+    const mockFilePath = './__mocks__/inject-decorator.ugly-comments-stories.txt';
+    const source = fs.readFileSync(mockFilePath, 'utf-8');
+    const result = injectDecorator(
+      source,
+      ADD_DECORATOR_STATEMENT,
+      path.resolve(__dirname, mockFilePath),
+      { parser: 'javascript' }
     );
-    const result = injectDecorator(source, ADD_DECORATOR_STATEMENT);
 
     it('should delete ugly comments from the generated story source', () => {
       expect(result.storySource).toMatchSnapshot();
@@ -68,11 +90,14 @@ describe('inject-decorator', () => {
   });
 
   describe('stories with ugly comments in ts', () => {
-    const source = fs.readFileSync(
-      './__mocks__/inject-decorator.ts.ugly-comments-stories.txt',
-      'utf-8'
+    const mockFilePath = './__mocks__/inject-decorator.ts.ugly-comments-stories.txt';
+    const source = fs.readFileSync(mockFilePath, 'utf-8');
+    const result = injectDecorator(
+      source,
+      ADD_DECORATOR_STATEMENT,
+      path.resolve(__dirname, mockFilePath),
+      { parser: 'typescript' }
     );
-    const result = injectDecorator(source, ADD_DECORATOR_STATEMENT, { parser: 'typescript' });
 
     it('should delete ugly comments from the generated story source', () => {
       expect(result.storySource).toMatchSnapshot();
@@ -80,9 +105,14 @@ describe('inject-decorator', () => {
   });
 
   it('will not change the source when there are no "storiesOf" functions', () => {
-    const source = fs.readFileSync('./__mocks__/inject-decorator.no-stories.txt', 'utf-8');
+    const mockFilePath = './__mocks__/inject-decorator.no-stories.txt';
+    const source = fs.readFileSync(mockFilePath, 'utf-8');
 
-    const result = injectDecorator(source, ADD_DECORATOR_STATEMENT);
+    const result = injectDecorator(
+      source,
+      ADD_DECORATOR_STATEMENT,
+      path.resolve(__dirname, mockFilePath)
+    );
 
     expect(result.changed).toBeFalsy();
     expect(result.addsMap).toEqual({});

addons/storysource/src/loader/parsers/parser-js.js

@@ -1,7 +1,7 @@
 import parseJs from 'prettier/parser-babylon';
 
 function parse(source) {
-  return parseJs(source);
+  return parseJs.parsers.babylon.parse(source);
 }
 
 export default {

addons/storysource/src/loader/parsers/parser-ts.js

@@ -1,7 +1,7 @@
 import parseTs from 'prettier/parser-typescript';
 
 function parse(source) {
-  return parseTs(source);
+  return parseTs.parsers.typescript.parse(source);
 }
 
 export default {

yarn.lock

@@ -13408,14 +13408,14 @@ prettier@^1.13.0:
   version "1.13.2"
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.13.2.tgz#412b87bc561cb11074d2877a33a38f78c2303cda"
 
+prettier@^1.13.3:
+  version "1.13.3"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.13.3.tgz#e74c09a7df6519d472ca6febaa37cf7addb48a20"
+
 prettier@^1.7.0:
   version "1.10.2"
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.10.2.tgz#1af8356d1842276a99a5b5529c82dd9e9ad3cc93"
 
-prettier@~1.12.1:
-  version "1.12.1"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.12.1.tgz#c1ad20e803e7749faf905a409d2367e06bbe7325"
-
 pretty-bytes@^4.0.2:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/pretty-bytes/-/pretty-bytes-4.0.2.tgz#b2bf82e7350d65c6c33aa95aaa5a4f6327f61cd9"