Demos: Add Rollup example with a mix of import, input, and output

Ref qunitjs#1551.
Krinkle · Jul 25, 2024 · 009f964 · 009f964
1 parent 3a09b40
commit 009f964
Show file tree

Hide file tree

Showing 23 changed files with 337 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -3,6 +3,7 @@
 /coverage/
 /demos/*/package-lock.json
 /demos/*/node_modules/
+/demos/rollup/dist/
 /docs/.jekyll-cache/
 /docs/_site/
 /docs/Gemfile.lock

diff --git a/demos/rollup/Gruntfile.js b/demos/rollup/Gruntfile.js
@@ -0,0 +1,40 @@
+/* eslint-env node */
+module.exports = function (grunt) {
+  grunt.loadNpmTasks('grunt-contrib-connect');
+  grunt.loadNpmTasks('grunt-contrib-qunit');
+
+  grunt.initConfig({
+    connect: {
+      all: {
+        options: {
+          useAvailablePort: true,
+          base: '.'
+        }
+      }
+    },
+    qunit: {
+      options: {
+      },
+      all: ['test-*.html']
+    }
+  });
+
+  grunt.event.once('connect.all.listening', function(host, port) {
+    grunt.config('qunit.options.httpBase', `http://localhost:${port}`);
+    // console.log(grunt.config()); // DEBUG
+  });
+
+
+  let results = [];
+  grunt.event.on('qunit.on.testEnd', function (test) {
+    results.push(
+      `>> ${test.status} test "${test.fullName.join(' > ')}"`
+    );
+  });
+  grunt.event.on('qunit.on.runEnd', function () {
+    grunt.log.writeln(results.join('\n'));
+    results = [];
+  });
+
+  grunt.registerTask('test', ['connect', 'qunit']);
+};
diff --git a/demos/rollup/build.mjs b/demos/rollup/build.mjs
@@ -0,0 +1,103 @@
+import fs from 'node:fs';
+
+import { rollup } from 'rollup';
+import resolve from '@rollup/plugin-node-resolve';
+import commonjs from '@rollup/plugin-commonjs';
+
+const plugins = [ commonjs(), resolve() ];
+
+const inputs = [
+  {
+    input:'test/test-import-default-from-cjs.js',
+    plugins
+  },
+  {
+    input: 'test/test-import-from-cjs.js',
+    plugins
+  },
+  {
+    input: 'test/test-mixed.js',
+    plugins
+  },
+  {
+    input: 'test/test-require-from-cjs.js',
+    plugins,
+    // Ignore "output.name" warning for test-require-from-cjs.iife.js
+    onwarn: () => {}
+  }
+];
+const outputs = [
+  {
+    dir: 'dist/',
+    entryFileNames: '[name].[format].js',
+    format: 'es'
+  },
+  {
+    dir: 'dist/',
+    entryFileNames: '[name].[format].js',
+    format: 'cjs'
+  },
+  {
+    dir: 'dist/',
+    entryFileNames: '[name].[format].js',
+    format: 'iife'
+  },
+  {
+    dir: 'dist/',
+    entryFileNames: '[name].[format].js',
+    format: 'umd',
+    name: 'UNUSED'
+  }
+];
+const htmlTemplate = `
+<!DOCTYPE html>
+<html>
+<head>
+<title>{{title}}</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+{{scriptTag}}
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
+`;
+const scriptTag = (src) => {
+  if (src.endsWith('.es.js')) {
+    return ;
+  } else {
+  }
+};
+
+(async function main() {
+  const entries = fs.readdirSync('.');
+  for (const entry of entries) {
+    if (entry.match(/^test-.*\.html$/)) {
+      fs.rmSync(entry);
+    }
+  }
+  for (const input of inputs) {
+    const bundle = await rollup(input);
+
+    for (const outputOptions of outputs) {
+      const { output } = await bundle.write(outputOptions);
+      const fileName = output[0].fileName;
+      console.log('... built ' + fileName );
+
+      if ( outputOptions.format !== 'cjs' ) {
+        const html = htmlTemplate
+          .replace('{{title}}', fileName)
+          .replace('{{scriptTag}}', (
+            fileName.endsWith('.es.js')
+              ? `<script src="dist/${fileName}" type="module"></script>`
+              : `<script src="dist/${fileName}"></script>`
+          ));
+
+        fs.writeFileSync(
+          fileName.replace('.js', '') + '.html',
+          html
+        );
+      }
+    }
+  }
+}());
diff --git a/demos/rollup/favicon.ico b/demos/rollup/favicon.ico
diff --git a/demos/rollup/package.json b/demos/rollup/package.json
@@ -0,0 +1,16 @@
+{
+  "private": true,
+  "devDependencies": {
+    "@rollup/plugin-commonjs": "^26.0.1",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "grunt": "1.6.1",
+    "grunt-contrib-connect": "^5.0.0",
+    "grunt-contrib-qunit": "10.1.1",
+    "qunit": "file:../..",
+    "rollup": "^4.18.0"
+  },
+  "scripts": {
+    "build": "node build.mjs",
+    "test": "grunt test"
+  }
+}
diff --git a/demos/rollup/test-import-default-from-cjs.es.html b/demos/rollup/test-import-default-from-cjs.es.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-import-default-from-cjs.es.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-import-default-from-cjs.es.js" type="module"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-import-default-from-cjs.iife.html b/demos/rollup/test-import-default-from-cjs.iife.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-import-default-from-cjs.iife.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-import-default-from-cjs.iife.js"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-import-default-from-cjs.umd.html b/demos/rollup/test-import-default-from-cjs.umd.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-import-default-from-cjs.umd.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-import-default-from-cjs.umd.js"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-import-from-cjs.es.html b/demos/rollup/test-import-from-cjs.es.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-import-from-cjs.es.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-import-from-cjs.es.js" type="module"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-import-from-cjs.iife.html b/demos/rollup/test-import-from-cjs.iife.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-import-from-cjs.iife.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-import-from-cjs.iife.js"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-import-from-cjs.umd.html b/demos/rollup/test-import-from-cjs.umd.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-import-from-cjs.umd.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-import-from-cjs.umd.js"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-mixed.es.html b/demos/rollup/test-mixed.es.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-mixed.es.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-mixed.es.js" type="module"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-mixed.iife.html b/demos/rollup/test-mixed.iife.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-mixed.iife.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-mixed.iife.js"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-mixed.umd.html b/demos/rollup/test-mixed.umd.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-mixed.umd.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-mixed.umd.js"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-require-from-cjs.es.html b/demos/rollup/test-require-from-cjs.es.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-require-from-cjs.es.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-require-from-cjs.es.js" type="module"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-require-from-cjs.iife.html b/demos/rollup/test-require-from-cjs.iife.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-require-from-cjs.iife.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-require-from-cjs.iife.js"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test-require-from-cjs.umd.html b/demos/rollup/test-require-from-cjs.umd.html
@@ -0,0 +1,12 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>test-require-from-cjs.umd.js</title>
+<link rel="stylesheet" href="node_modules/qunit/qunit/qunit.css">
+<script src="dist/test-require-from-cjs.umd.js"></script>
+</head>
+<body>
+<div id="qunit"></div>
+</body>
+</html>
diff --git a/demos/rollup/test/package.json b/demos/rollup/test/package.json
@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}
diff --git a/demos/rollup/test/src.js b/demos/rollup/test/src.js
@@ -0,0 +1,3 @@
+export function add (a, b) {
+  return a + b;
+}
diff --git a/demos/rollup/test/test-import-default-from-cjs.js b/demos/rollup/test/test-import-default-from-cjs.js
@@ -0,0 +1,8 @@
+import QUnit from 'qunit';
+import { add } from './src.js';
+
+QUnit.module('import default from qunit.cjs', function () {
+  QUnit.test('example', function (assert) {
+    assert.equal(add(2, 3), 5);
+  });
+});
diff --git a/demos/rollup/test/test-import-from-cjs.js b/demos/rollup/test/test-import-from-cjs.js
@@ -0,0 +1,8 @@
+import { module, test } from 'qunit';
+import { add } from './src.js';
+
+module('import { module,test } from qunit.cjs', function () {
+  test('example', function (assert) {
+    assert.equal(add(2, 3), 5);
+  });
+});
diff --git a/demos/rollup/test/test-mixed.js b/demos/rollup/test/test-mixed.js
@@ -0,0 +1,3 @@
+import './test-import-default-from-cjs.js';
+import './test-import-from-cjs.js';
+import './test-require-from-cjs.js';
diff --git a/demos/rollup/test/test-require-from-cjs.js b/demos/rollup/test/test-require-from-cjs.js
@@ -0,0 +1,8 @@
+const QUnit = require('qunit');
+const { add } = require('./src.js');
+
+QUnit.module('require from qunit.cjs', function () {
+  QUnit.test('example', function (assert) {
+    assert.equal(add(2, 3), 5);
+  });
+});