feature: define blog slug in frontmatter

data/blog/2017-04-18--welcoming/index.md

@@ -1,13 +1,14 @@
 ---
 title: Welcoming
 createdDate: '2017-04-18'
-updatedDate: '2017-05-06'
+updatedDate: '2018-02-15'
 author: Fabien BERNARD
 tags:
   - starter
   - gatsby
 image: pexels-photo-253092.jpeg
 draft: false
+slug: 2017-04-18/welcoming
 ---
 
 Welcome to gatsby-starter!

gatsby-node.js

@@ -29,16 +29,26 @@ exports.modifyWebpackConfig = ({config, stage}) => {
   }
 };
 
+// If slug defined in frontmatter use it
+// otherwise use the filepath as slug
+const buildSlug = (frontmatterSlug, basePath, name) => {
+  if (frontmatterSlug) {
+    return `/${basePath}/${frontmatterSlug}/`;
+  }
+  return `/${basePath}/${name}/`;
+};
+
 // Create slugs for files.
 // Slug will used for blog page path.
 exports.onCreateNode = ({node, boundActionCreators, getNode}) => {
   const {createNodeField} = boundActionCreators;
   let slug;
   switch (node.internal.type) {
     case `MarkdownRemark`:
+      const frontmatterSlug = get(node, 'frontmatter.slug', null);
       const fileNode = getNode(node.parent);
       const [basePath, name] = fileNode.relativePath.split('/');
-      slug = `/${basePath}/${name}/`;
+      slug = buildSlug(frontmatterSlug, basePath, name);
       break;
   }
   if (slug) {

test/__snapshots__/gatsby-node.test.js.snap

@@ -193,6 +193,18 @@ Array [
     Object {
       "name": "slug",
       "node": Object {
+        "frontmatter": Object {
+          "author": "Fabien BERNARD",
+          "createdDate": "2017-04-18",
+          "draft": false,
+          "image": "pexels-photo-253092.jpeg",
+          "tags": Array [
+            "starter",
+            "gatsby",
+          ],
+          "title": "Welcoming",
+          "updatedDate": "2017-05-06",
+        },
         "internal": Object {
           "type": "MarkdownRemark",
         },
@@ -203,3 +215,33 @@ Array [
   ],
 ]
 `;
+
+exports[`gatsby-node onCreateNode should use frontmatter slug for MarkdownRemark file when defined 1`] = `
+Array [
+  Array [
+    Object {
+      "name": "slug",
+      "node": Object {
+        "frontmatter": Object {
+          "author": "Fabien BERNARD",
+          "createdDate": "2017-04-18",
+          "draft": false,
+          "image": "pexels-photo-253092.jpeg",
+          "slug": "2017-04-18/welcoming",
+          "tags": Array [
+            "starter",
+            "gatsby",
+          ],
+          "title": "Welcoming",
+          "updatedDate": "2017-05-06",
+        },
+        "internal": Object {
+          "type": "MarkdownRemark",
+        },
+        "parent": "parent",
+      },
+      "value": "/blog/2017-04-18/welcoming/",
+    },
+  ],
+]
+`;

test/gatsby-node.test.js

@@ -196,11 +196,49 @@ describe('gatsby-node', () => {
           relativePath: 'blog/2017-04-18--welcoming/index.md'
         }
       );
+
       const node = {
         internal: {
           type: 'MarkdownRemark'
         },
-        parent: 'parent'
+        parent: 'parent',
+        frontmatter: {
+          title: 'Welcoming',
+          createdDate: '2017-04-18',
+          updatedDate: '2017-05-06',
+          author: 'Fabien BERNARD',
+          tags: ['starter', 'gatsby'],
+          image: 'pexels-photo-253092.jpeg',
+          draft: false
+        }
+      };
+      onCreateNode({node, boundActionCreators, getNode});
+
+      expect(boundActionCreators.createNodeField.mock.calls).toMatchSnapshot();
+    });
+
+    it('should use frontmatter slug for MarkdownRemark file when defined', () => {
+      getNode.mockReturnValue(
+        {
+          relativePath: 'blog/2017-04-18--welcoming/index.md'
+        }
+      );
+
+      const node = {
+        internal: {
+          type: 'MarkdownRemark'
+        },
+        parent: 'parent',
+        frontmatter: {
+          title: 'Welcoming',
+          createdDate: '2017-04-18',
+          updatedDate: '2017-05-06',
+          author: 'Fabien BERNARD',
+          tags: ['starter', 'gatsby'],
+          image: 'pexels-photo-253092.jpeg',
+          draft: false,
+          slug: '2017-04-18/welcoming'
+        }
       };
       onCreateNode({node, boundActionCreators, getNode});