[v2] re-add tests for sass and less plugins + update using-sass example (#5223)

* update "using-sass" example

* [gatsby-plugin-sass] add tests

* [gatsby-plugin-less] update tests and README

* commit missing file

* add missing snapshot

Author: pieh

examples/using-sass/package.json

@@ -10,12 +10,12 @@
   "author": "Daniel Farrell <[email protected]>",
   "license": "MIT",
   "dependencies": {
-    "gatsby": "canary",
-    "gatsby-plugin-google-analytics": "latest",
-    "gatsby-plugin-offline": "latest",
-    "gatsby-plugin-sass": "canary",
-    "react": "^16.2.0",
-    "react-dom": "^16.2.0",
+    "gatsby": "next",
+    "gatsby-plugin-google-analytics": "next",
+    "gatsby-plugin-offline": "next",
+    "gatsby-plugin-sass": "next",
+    "react": "^16.3.0",
+    "react-dom": "^16.3.0",
     "tachyons-sass": "^4.7.1"
   }
 }

examples/using-sass/src/layouts/index.js

@@ -3,7 +3,7 @@ import PropTypes from "prop-types"
 
 import "../styles/main.scss"
 
-const Layout = ({ children }) => <div>{children()}</div>
+const Layout = ({ children }) => <div>{children}</div>
 
 Layout.propTypes = {
   children: PropTypes.any,

examples/using-sass/src/pages/index.js

@@ -1,20 +1,25 @@
 import React from "react"
 
+import Layout from "../layouts/index"
+
 class Index extends React.Component {
   render() {
     return (
-      <div>
+      <Layout>
         <h1 className="tu">Hi sassy friends</h1>
         <div className="sass-nav-example">
           <h2>Nav example</h2>
           <ul className="pa0 ma0 list">
             <li>
+              {/* eslint-disable-next-line */}
               <a href="#">Store</a>
             </li>
             <li>
+              {/* eslint-disable-next-line */}
               <a href="#">Help</a>
             </li>
             <li>
+              {/* eslint-disable-next-line */}
               <a href="#">Logout</a>
             </li>
             <li>
@@ -24,7 +29,7 @@ class Index extends React.Component {
             </li>
           </ul>
         </div>
-      </div>
+      </Layout>
     )
   }
 }

packages/gatsby-plugin-less/README.md

@@ -54,3 +54,41 @@ plugins: [
   },
 ]
 ```
+
+## Breaking changes history
+
+<!-- Please keep the breaking changes list ordered with the newest change at the top -->
+
+### v2.0.0
+
+`theme` option has been removed. You can pass configuration object to less-loader:
+
+```diff
+plugins: [
+  {
+    resolve: `gatsby-plugin-less`,
+    options: {
+-      theme: {
+-        "text-color": `#fff`,
+-      }
++      modifyVars: {
++        "text-color": `#fff`,
++      }
+    },
+  },
+]
+```
+
+```diff
+plugins: [
+  {
+    resolve: `gatsby-plugin-less`,
+    options: {
+-      theme: `./src/theme.js`,
++      modifyVars: require(`./src/theme.js`),
+    },
+  },
+]
+```
+
+