CHANGE to micromatch && FIX tests && IMPROVE.warning message & documentation & migration-guide

MIGRATION.md

@@ -117,11 +117,21 @@
 
 ### Correct globs in main.js
 
-In 5.3 we introduced the `main.js` file with an `entries` property. This property was documented as a "glob" pattern. This was our intention, however the implementation allowed for non valid globs to be specified and work. In fact we promoted invalid globs in our documentation and CLI templates.
+In 5.3 we introduced the `main.js` file with an `stories` property. This property was documented as a "glob" pattern. This was our intention, however the implementation allowed for non valid globs to be specified and work. In fact we promoted invalid globs in our documentation and CLI templates.
 
 We've corrected this, the CLI templates have been changed to valid globs.
 
-We've also changed the code that resolves these globs, so that invalid globs will log a warning. They will break in the future, so if you see this warning, please ensue you're specifying a valid glob.
+We've also changed the code that resolves these globs, so that invalid globs will log a warning. They will break in the future, so if you see this warning, please ensure you're specifying a valid glob.
+
+Example of an **invalid** glob:
+```
+stories: ['./**/*.stories.(ts|js)']
+```
+
+Example of an **valid** glob:
+```
+stories: ['./**/*.stories.@(ts|js)']
+```
 
 ### Zero config typescript
 

lib/core/package.json

@@ -74,6 +74,7 @@
     "chalk": "^4.0.0",
     "cli-table3": "0.6.0",
     "commander": "^5.0.0",
+    "micromatch": "^4.0.2",
     "core-js": "^3.0.1",
     "css-loader": "^3.5.3",
     "detect-port": "^1.3.0",
@@ -96,7 +97,6 @@
     "ip": "^1.1.5",
     "json5": "^2.1.1",
     "lazy-universal-dotenv": "^3.0.1",
-    "nanomatch": "^1.2.13",
     "node-fetch": "^2.6.0",
     "pkg-dir": "^4.2.0",
     "pnp-webpack-plugin": "1.6.4",

lib/core/src/server/preview/entries.js

@@ -63,9 +63,12 @@ export async function createPreviewEntry(options) {
 
     if (files.length === 0) {
       logger.warn(dedent`
-      We found no files matching any of the following globs:
-      
-      ${stories.join('\n')}
+        We found no files matching any of the following globs:
+        
+        ${stories.join('\n')}
+
+        Maybe your glob was invalid?
+        see: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#correct-globs-in-main-js
       `);
     } else {
       logger.info(`=> Adding stories defined in "${path.join(configDir, 'main.js')}".`);

lib/core/src/server/preview/to-require-context.js

@@ -1,5 +1,5 @@
 import globBase from 'glob-base';
-import { makeRe } from 'nanomatch';
+import { makeRe } from 'micromatch';
 
 const isObject = (val) => val != null && typeof val === 'object' && Array.isArray(val) === false;
 export const toRequireContext = (input) => {

lib/core/src/server/preview/to-require-context.test.js

@@ -2,6 +2,51 @@ import path from 'path';
 import { toRequireContext } from './to-require-context';
 
 const testCases = [
+  {
+    glob: '**/*.stories.tsx',
+    validPaths: [
+      './Icon.stories.tsx',
+      './src/Icon.stories.tsx',
+      './src/components/Icon.stories.tsx',
+      './src/components/Icon.stories/Icon.stories.tsx',
+    ],
+    invalidPaths: [
+      './stories.tsx',
+      './Icon.stories.ts',
+      './Icon.stories.js',
+      './src/components/stories.tsx',
+      './src/components/Icon.stories/stories.tsx',
+      './src/components/Icon.stories.ts',
+      './src/components/Icon.stories.js',
+    ],
+  },
+  // INVALID GLOB
+  {
+    glob: '../src/stories/**/*.stories.(js|mdx)',
+    validPaths: [
+      '../src/stories/components/Icon.stories.js',
+      '../src/stories/Icon.stories.js',
+      '../src/stories/Icon.stories.mdx',
+      '../src/stories/components/Icon/Icon.stories.js',
+      '../src/stories/components/Icon.stories/Icon.stories.mdx',
+    ],
+    invalidPaths: [
+      './stories.js',
+      './src/stories/Icon.stories.js',
+      './Icon.stories.js',
+      '../src/Icon.stories.mdx',
+      '../src/stories/components/Icon/Icon.stories.ts',
+      '../src/stories/components/Icon/Icon.mdx',
+    ],
+  },
+  {
+    glob: 'dirname/../stories/*.stories.*',
+    validPaths: [
+      './dirname/../stories/App.stories.js',
+      './dirname/../stories/addon-centered.stories.js',
+    ],
+    invalidPaths: ['./dirname/../stories.js', './dirname/../App.stories.js'],
+  },
   {
     glob: '../src/stories/**/@(*.stories.js|*.stories.mdx)',
     validPaths: [
@@ -56,6 +101,7 @@ const testCases = [
       '../src/stories/components/Icon/Icon.mdx',
     ],
   },
+  // INVALID GLOB
   {
     glob: '../src/stories/**/*.stories.[tj]sx',
     validPaths: [

yarn.lock

@@ -22955,7 +22955,7 @@ nan@^2.12.1, nan@^2.13.2, nan@^2.14.0:
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.1.tgz#d7be34dfa3105b91494c3147089315eff8874b01"
   integrity sha512-isWHgVjnFjh2x2yuJ/tj3JbwoHu3UC2dX5G/88Cm24yB6YopVgxvBObDY7n5xW6ExmFhJpSEQqFPvq9zaXc8Jw==
 
-nanomatch@^1.2.13, nanomatch@^1.2.9:
+nanomatch@^1.2.9:
   version "1.2.13"
   resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119"
   integrity sha512-fpoe2T0RbHwBTBUOftAfBPaDEi06ufaUai0mE6Yn1kacc3SnTErfb/h+X94VXzI64rKFHYImXSvdwGGCmwOqCA==