Merge pull request #14 from form8ion/alpha

package.json

@@ -52,6 +52,7 @@
     "@cucumber/cucumber": "7.2.1",
     "@form8ion/babel-preset": "1.6.59",
     "@form8ion/commitlint-config": "1.0.19",
+    "@form8ion/core": "1.4.2",
     "@form8ion/eslint-config": "1.7.18",
     "@form8ion/eslint-config-cucumber": "1.4.0",
     "@form8ion/eslint-config-mocha": "1.2.12",
@@ -79,5 +80,10 @@
     "rollup": "2.50.1",
     "rollup-plugin-auto-external": "2.0.0",
     "sinon": "11.1.1"
+  },
+  "dependencies": {
+    "@form8ion/cypress-scaffolder": "^2.2.0",
+    "@form8ion/is-website-vulnerable": "^1.0.0",
+    "deepmerge": "^4.2.2"
   }
 }

src/index.js

@@ -1 +1 @@
-export {default as scaffold} from './scaffold';
+export {default as scaffold} from './scaffolder';

src/scaffolder-test.js

@@ -0,0 +1,65 @@
+import {promises as fs} from 'fs';
+import {assert} from 'chai';
+import sinon from 'sinon';
+import any from '@travi/any';
+import * as testingScaffolder from './testing-scaffolder';
+import scaffold from './scaffolder';
+
+suite('scaffolder', () => {
+  let sandbox;
+
+  setup(() => {
+    sandbox = sinon.createSandbox();
+
+    sandbox.stub(fs, 'writeFile');
+    sandbox.stub(testingScaffolder, 'default');
+  });
+
+  teardown(() => sandbox.restore());
+
+  test('that the presentation is scaffolded', async () => {
+    const projectRoot = any.string();
+    const testingDevDependencies = any.listOf(any.word);
+    const testingScripts = any.simpleObject();
+    testingScaffolder.default
+      .withArgs({projectRoot})
+      .resolves({devDependencies: testingDevDependencies, scripts: testingScripts});
+
+    const {dependencies, devDependencies, scripts} = await scaffold({projectRoot});
+
+    assert.calledWith(
+      fs.writeFile, `${projectRoot}/slides.md`,
+      `---
+theme: default
+
+# random image from a curated Unsplash collection by Anthony
+# like them? see https://unsplash.com/collections/94734566/slidev
+background: https://source.unsplash.com/collection/94734566/1920x1080
+
+# apply any windi css classes to the current slide
+class: 'text-center'
+
+# https://sli.dev/custom/highlighters.html
+highlighter: prism
+
+# some information about the slides, markdown enabled
+info: |
+  ## Slidev Starter Template
+  Presentation slides for developers.
+
+  Learn more at [Sli.dev](https://sli.dev)
+---`
+    );
+    assert.deepEqual(dependencies, ['@slidev/cli', '@slidev/theme-default']);
+    assert.deepEqual(devDependencies, testingDevDependencies);
+    assert.deepEqual(
+      scripts,
+      {
+        dev: 'slidev',
+        build: 'slidev build',
+        export: 'slidev export',
+        ...testingScripts
+      }
+    );
+  });
+});

src/scaffolder.js

@@ -0,0 +1,44 @@
+import {promises as fs} from 'fs';
+import deepmerge from 'deepmerge';
+import scaffoldTesting from './testing-scaffolder';
+
+export default async function ({projectRoot}) {
+  const [testingResults] = await Promise.all([
+    scaffoldTesting({projectRoot}),
+    fs.writeFile(
+      `${projectRoot}/slides.md`,
+      `---
+theme: default
+
+# random image from a curated Unsplash collection by Anthony
+# like them? see https://unsplash.com/collections/94734566/slidev
+background: https://source.unsplash.com/collection/94734566/1920x1080
+
+# apply any windi css classes to the current slide
+class: 'text-center'
+
+# https://sli.dev/custom/highlighters.html
+highlighter: prism
+
+# some information about the slides, markdown enabled
+info: |
+  ## Slidev Starter Template
+  Presentation slides for developers.
+
+  Learn more at [Sli.dev](https://sli.dev)
+---`
+    )
+  ]);
+
+  return deepmerge(
+    {
+      dependencies: ['@slidev/cli', '@slidev/theme-default'],
+      scripts: {
+        dev: 'slidev',
+        build: 'slidev build',
+        export: 'slidev export'
+      }
+    },
+    testingResults
+  );
+}

src/testing-scaffolder-test.js

@@ -0,0 +1,47 @@
+import deepmerge from 'deepmerge';
+import * as cypressScaffolder from '@form8ion/cypress-scaffolder';
+import * as vulnerableScaffolder from '@form8ion/is-website-vulnerable';
+import sinon from 'sinon';
+import any from '@travi/any';
+import {assert} from 'chai';
+import scaffoldTesting from './testing-scaffolder';
+
+suite('testing scaffolder', () => {
+  let sandbox;
+
+  setup(() => {
+    sandbox = sinon.createSandbox();
+
+    sandbox.stub(cypressScaffolder, 'scaffold');
+    sandbox.stub(vulnerableScaffolder, 'scaffold');
+  });
+
+  teardown(() => sandbox.restore());
+
+  test('that cypress is configured for smoke testing', async () => {
+    const projectRoot = any.string();
+    const cypressResults = any.simpleObject();
+    const vulnerableResults = any.simpleObject();
+    const baseUrl = 'http://localhost:8000';
+    cypressScaffolder.scaffold
+      .withArgs({projectRoot, testDirectory: 'test/smoke/', testBaseUrl: baseUrl})
+      .resolves(cypressResults);
+    vulnerableScaffolder.scaffold.withArgs({baseUrl}).resolves(vulnerableResults);
+
+    assert.deepEqual(
+      await scaffoldTesting({projectRoot}),
+      deepmerge.all([
+        cypressResults,
+        vulnerableResults,
+        {
+          scripts: {
+            'test:served': "start-server-and-test 'npm start' http://localhost:8000"
+              + " 'npm-run-all --print-label --parallel test:served:*'",
+            'test:served:smoke': 'run-s cypress:run'
+          },
+          devDependencies: ['start-server-and-test']
+        }
+      ])
+    );
+  });
+});

src/testing-scaffolder.js

@@ -0,0 +1,25 @@
+import deepmerge from 'deepmerge';
+import {scaffold as scaffoldCypress} from '@form8ion/cypress-scaffolder';
+import {scaffold as scaffoldVulnerable} from '@form8ion/is-website-vulnerable';
+
+export default async function ({projectRoot}) {
+  const devServerUrl = 'http://localhost:8000';
+
+  const [cypressResults, vulnerableResults] = await Promise.all([
+    scaffoldCypress({projectRoot, testDirectory: 'test/smoke/', testBaseUrl: devServerUrl}),
+    scaffoldVulnerable({baseUrl: devServerUrl})
+  ]);
+
+  return deepmerge.all([
+    cypressResults,
+    vulnerableResults,
+    {
+      scripts: {
+        'test:served': 'start-server-and-test '
+          + `'npm start' ${devServerUrl} 'npm-run-all --print-label --parallel test:served:*'`,
+        'test:served:smoke': 'run-s cypress:run'
+      },
+      devDependencies: ['start-server-and-test']
+    }
+  ]);
+}

test/integration/features/scaffolder.feature

@@ -2,3 +2,7 @@ Feature: Scaffolder
 
   Scenario: Scaffold
     When the project is scaffolded
+    Then the expected files are generated
+    And the framework dependencies are installed
+    And the scripts are defined
+    And smoke tests are wired up

test/integration/features/step_definitions/common-steps.js

@@ -1,7 +1,9 @@
+import {promises as fs} from 'fs';
 import {resolve} from 'path';
 import {After, When} from '@cucumber/cucumber';
 import stubbedFs from 'mock-fs';
 
+const packagePreviewDirectory = '../__package_previews__/slidev';
 const stubbedNodeModules = stubbedFs.load(resolve(__dirname, '..', '..', '..', '..', 'node_modules'));
 
 After(function () {
@@ -13,8 +15,33 @@ When('the project is scaffolded', async function () {
   const {scaffold} = require('@form8ion/slidev');
 
   stubbedFs({
-    node_modules: stubbedNodeModules
+    node_modules: stubbedNodeModules,
+    [packagePreviewDirectory]: {
+      '@form8ion': {
+        slidev: {
+          node_modules: {
+            '.pnpm': {
+              '@[email protected]': {
+                node_modules: {
+                  '@form8ion': {
+                    'cypress-scaffolder': {
+                      templates: {
+                        'canary-spec.js': await fs.readFile(resolve(
+                          __dirname,
+                          '../../../../',
+                          'node_modules/@form8ion/cypress-scaffolder/templates/canary-spec.js'
+                        ))
+                      }
+                    }
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    }
   });
 
-  await scaffold({projectRoot: process.cwd()});
+  this.results = await scaffold({projectRoot: process.cwd()});
 });

test/integration/features/step_definitions/scaffold-steps.js

@@ -0,0 +1,44 @@
+import {promises as fs} from 'fs';
+import {Then} from '@cucumber/cucumber';
+import {assert} from 'chai';
+
+Then('the expected files are generated', async function () {
+  assert.equal(
+    await fs.readFile(`${process.cwd()}/slides.md`, 'utf-8'),
+    `---
+theme: default
+
+# random image from a curated Unsplash collection by Anthony
+# like them? see https://unsplash.com/collections/94734566/slidev
+background: https://source.unsplash.com/collection/94734566/1920x1080
+
+# apply any windi css classes to the current slide
+class: 'text-center'
+
+# https://sli.dev/custom/highlighters.html
+highlighter: prism
+
+# some information about the slides, markdown enabled
+info: |
+  ## Slidev Starter Template
+  Presentation slides for developers.
+
+  Learn more at [Sli.dev](https://sli.dev)
+---`
+  );
+});
+
+Then('the scripts are defined', async function () {
+  assert.include(
+    this.results.scripts,
+    {
+      dev: 'slidev',
+      build: 'slidev build',
+      export: 'slidev export'
+    }
+  );
+});
+
+Then('the framework dependencies are installed', async function () {
+  assert.deepEqual(this.results.dependencies, ['@slidev/cli', '@slidev/theme-default']);
+});