fix: JS examples now work correctly.

gulp-tasks/build-nunjucks.js

@@ -23,7 +23,8 @@ const mergingJSONFiles = () => {
 };
 
 const manageEnv = env => {
-  // Custom Filters
+  // Custom Filters for nunjucks
+
   // This filter beautify's our html, useful for the pre/code blocks in component-example.njk
   env.addFilter('formatHTML', html => {
     const beautifulHTML = beautify(html.trim(), {
@@ -39,6 +40,7 @@ const manageEnv = env => {
     return beautifulHTML;
   });
 
+  // Beautify function shared by the two JS filters below
   const beautifyJavascript = js =>
     beautifyJS(js.trim(), {
       indent_size: 2,
@@ -47,13 +49,14 @@ const manageEnv = env => {
       max_preserve_newlines: 0
     });
 
+  // Filter to format JS
   env.addFilter('formatJS', js => {
     return beautifyJavascript(js);
   });
 
+  // Filter to convert content to ES5
   env.addFilter('convertToES5', js => {
-    const compileJs = input =>
-      babel.transform(input, { presets: ['env', { modules: false }] }).code;
+    const compileJs = input => babel.transform(input, { presets: ['env'] }).code; // BABEL COMPILER ES6 => ES5
     const compiledJS = compileJs(js);
 
     return beautifyJavascript(compiledJS);

src/www/_partials/component-example/component-example.njk

@@ -127,10 +127,6 @@
           {% endfilter -%}
         </code></pre>
       </details>
-
-      {# <script type="text/plain" class="wmnds-website-code-example__script">
-        {%- include componentPath + "_example.js" -%}
-      </script> #}
     </div>
   {% endif %}
 </div>

src/www/_partials/component-example/index.js

@@ -1,5 +1,4 @@
 import componentExample from './_component-example';
-import componentExampleScript from './_component-example-script';
 import componentExampleIframe from './_component-example-iframe';
 
-export { componentExample, componentExampleScript, componentExampleIframe };
+export { componentExample, componentExampleIframe };

src/www/wmnds-website.js

@@ -8,11 +8,7 @@ import footerJs from '../wmnds/patterns/footer/_example';
 import accordionsJS from '../wmnds/components/accordion/_example';
 import searchFilterJs from '../wmnds/patterns/search/search-filter/_example';
 
-import {
-  componentExample,
-  componentExampleScript,
-  componentExampleIframe
-} from './_partials/component-example';
+import { componentExample, componentExampleIframe } from './_partials/component-example';
 
 const isInIframe = window.frameElement && window.frameElement.nodeName === 'IFRAME'; // check if we are in an iframe
 // If not in iframe and we are in prod, then run sentry
@@ -46,6 +42,5 @@ window.addEventListener(
   cookies(),
   searchFilterJs(),
   componentExampleIframe(),
-  componentExampleScript(),
   componentExample)
 );