@atlassian/webresource-webpack-plugin 4.10.2-64a2ef2

package/test/use-cases/provided-module-replacement/webpack.config.with-map.js

@@ -0,0 +1,33 @@
+const path = require('path');
+const WrmPlugin = require('../../../src/WrmPlugin');
+const FRONTEND_SRC_DIR = path.join(__dirname, 'src');
+const OUTPUT_DIR = path.join(__dirname, 'target');
+
+const providedDependencies = new Map();
+providedDependencies.set('jquery', {
+    dependency: 'jira.webresources:jquery',
+    import: "require('jquery')",
+});
+providedDependencies.set('underscore', {
+    dependency: 'com.atlassian.plugin.jslibs:underscore-1.4.4',
+    import: "require('underscore')",
+});
+
+module.exports = {
+    mode: 'development',
+    entry: {
+        app: path.join(FRONTEND_SRC_DIR, 'app.js'),
+    },
+    plugins: [
+        new WrmPlugin({
+            pluginKey: 'com.atlassian.plugin.test',
+            xmlDescriptors: path.join(OUTPUT_DIR, 'META-INF', 'plugin-descriptor', 'wr-webpack-bundles.xml'),
+            verbose: false,
+            providedDependencies,
+        }),
+    ],
+    output: {
+        filename: '[name].js',
+        path: OUTPUT_DIR,
+    },
+};

package/test/use-cases/provided-module-replacement/webpack.config.with-object.js

@@ -0,0 +1,34 @@
+const path = require('path');
+const WrmPlugin = require('../../../src/WrmPlugin');
+const FRONTEND_SRC_DIR = path.join(__dirname, 'src');
+const OUTPUT_DIR = path.join(__dirname, 'target');
+
+const providedDependencies = {
+    jquery: {
+        dependency: 'jira.webresources:jquery',
+        import: "require('jquery')",
+    },
+    underscore: {
+        dependency: 'com.atlassian.plugin.jslibs:underscore-1.4.4',
+        import: "require('underscore')",
+    },
+};
+
+module.exports = {
+    mode: 'development',
+    entry: {
+        app: path.join(FRONTEND_SRC_DIR, 'app.js'),
+    },
+    plugins: [
+        new WrmPlugin({
+            pluginKey: 'com.atlassian.plugin.test',
+            xmlDescriptors: path.join(OUTPUT_DIR, 'META-INF', 'plugin-descriptor', 'wr-webpack-bundles.xml'),
+            verbose: false,
+            providedDependencies,
+        }),
+    ],
+    output: {
+        filename: '[name].js',
+        path: OUTPUT_DIR,
+    },
+};

package/test/use-cases/provided-modules-replacement-with-amd-target/provided-modules-replacement-with-amd-target.test.js

@@ -0,0 +1,62 @@
+const chai = require('chai');
+const assert = chai.assert;
+const parse = require('xml-parser');
+const webpack = require('webpack');
+const fs = require('fs');
+const path = require('path');
+
+chai.use(require('chai-string'));
+
+const targetDir = path.join(__dirname, 'target');
+const webresourceOutput = path.join(targetDir, 'META-INF', 'plugin-descriptor', 'wr-webpack-bundles.xml');
+
+describe('provided-modules-replacement', function() {
+    const config = require('./webpack.config.js');
+
+    let stats;
+    let error;
+    let entry;
+    let dependencies;
+
+    function getDependencies(node) {
+        return node.children.filter(n => n.name === 'dependency');
+    }
+
+    function getContent(nodes) {
+        return nodes.map(n => n.content);
+    }
+
+    beforeEach(done => {
+        webpack(config, (err, st) => {
+            error = err;
+            stats = st;
+
+            const xmlFile = fs.readFileSync(webresourceOutput, 'utf-8');
+            const results = parse(xmlFile);
+            entry = results.root.children.find(n => n.attributes.key.startsWith('entry'));
+            dependencies = getContent(getDependencies(entry));
+            done();
+        });
+    });
+
+    it('should create a webresource with dependencies for each async chunk', () => {
+        assert.ok(entry);
+        assert.ok(dependencies);
+        assert.equal(stats.hasErrors(), false);
+        assert.equal(stats.hasWarnings(), false);
+    });
+
+    it('add a dependency for the provided module to the webresource', () => {
+        assert.include(dependencies, 'jira.webresources:jquery');
+        assert.include(dependencies, 'com.atlassian.plugin.jslibs:underscore-1.4.4');
+        assert.include(dependencies, 'a.plugin.key:webresource-key');
+    });
+
+    it('should specify the provided dependencies as proper amd dependencies', () => {
+        // setup
+        const bundleFile = fs.readFileSync(path.join(targetDir, 'app.js'), 'utf-8');
+        const bundleLines = bundleFile.split('\n');
+
+        assert.startsWith(bundleLines[0], `define(["jquery","underscore"],`);
+    });
+});

package/test/use-cases/provided-modules-replacement-with-amd-target/src/app.js

@@ -0,0 +1,3 @@
+import $ from 'jquery';
+import 'wr-dependency!a.plugin.key:webresource-key';
+import _ from 'underscore';

package/test/use-cases/provided-modules-replacement-with-amd-target/webpack.config.js

@@ -0,0 +1,41 @@
+const path = require('path');
+
+const WrmPlugin = require('../../../src/WrmPlugin');
+const FRONTEND_SRC_DIR = path.join(__dirname, 'src');
+const OUTPUT_DIR = path.join(__dirname, 'target');
+
+const providedDependencies = new Map();
+providedDependencies.set('jquery', {
+    dependency: 'jira.webresources:jquery',
+    import: {
+        var: "require('jquery')",
+        amd: 'jquery',
+    },
+});
+providedDependencies.set('underscore', {
+    dependency: 'com.atlassian.plugin.jslibs:underscore-1.4.4',
+    import: {
+        var: "require('underscore')",
+        amd: 'underscore',
+    },
+});
+
+module.exports = {
+    mode: 'development',
+    entry: {
+        app: path.join(FRONTEND_SRC_DIR, 'app.js'),
+    },
+    plugins: [
+        new WrmPlugin({
+            pluginKey: 'com.atlassian.plugin.test',
+            xmlDescriptors: path.join(OUTPUT_DIR, 'META-INF', 'plugin-descriptor', 'wr-webpack-bundles.xml'),
+            verbose: false,
+            providedDependencies,
+        }),
+    ],
+    output: {
+        filename: '[name].js',
+        path: OUTPUT_DIR,
+        libraryTarget: 'amd',
+    },
+};

package/test/use-cases/qunit-test-wrm-web-resource/qunit-test-wrm-web-resource.test.js

@@ -0,0 +1,157 @@
+const assert = require('chai').assert;
+const parse = require('xml-parser');
+const webpack = require('webpack');
+const fs = require('fs');
+const path = require('path');
+
+const targetDir = path.join(__dirname, 'target');
+const webresourceOutput = path.join(targetDir, 'META-INF', 'plugin-descriptor', 'wr-webpack-bundles.xml');
+
+describe('qunit-test-wrm-web-resource', function() {
+    this.timeout(10000);
+    const config = require('./webpack.config.js');
+
+    let stats;
+    let entry1;
+    let entry2;
+    let testEntry1;
+    let testEntry2;
+    let qunitResources;
+
+    function getDependencies(node) {
+        return node.children.filter(n => n.name === 'dependency');
+    }
+
+    function getResources(node) {
+        return node.children.filter(n => n.name === 'resource');
+    }
+
+    function getContent(nodes) {
+        return nodes.map(n => n.content);
+    }
+
+    function getName(nodes) {
+        return nodes.map(n => n.attributes.name);
+    }
+
+    before(done => {
+        webpack(config, (err, st) => {
+            stats = st;
+
+            const xmlFile = fs.readFileSync(webresourceOutput, 'utf-8');
+            const results = parse(xmlFile);
+            [entry1, entry2] = results.root.children.filter(
+                n => n.attributes.key && n.attributes.key.startsWith('entrypoint')
+            );
+            [testEntry1, testEntry2] = results.root.children.filter(
+                n => n.attributes.key && n.attributes.key.startsWith('__test__entrypoint')
+            );
+            qunitResources = results.root.children.filter(n => n.attributes.type === 'qunit');
+            done();
+        });
+    });
+
+    it('should create an xml file without errors', () => {
+        // check
+        assert.equal(stats.hasErrors(), false, 'should not have errors');
+        assert.equal(stats.hasWarnings(), false, 'should not have warnings');
+    });
+
+    it('should create a "normal" and a "test" web-resource per entry', () => {
+        // check
+        assert.ok(entry1, 'entry1 does not exist');
+        assert.ok(entry2, 'entry2 does not exist');
+        assert.ok(testEntry1, 'testEntry1 does not exist');
+        assert.ok(testEntry2, 'testEntry2 does not exist');
+    });
+
+    it('should create qunit-resource entries per found test file - as specified by the glob', () => {
+        // setup
+        const [barResource, fooResource] = getName(qunitResources);
+
+        // check
+        assert.equal(qunitResources.length, 2, 'qunit resources not found');
+        assert.equal(
+            barResource,
+            'test/use-cases/qunit-test-wrm-web-resource/src/bar-dep_test.js',
+            'expected to find qunit resources for bar-dep.js'
+        );
+        assert.equal(
+            fooResource,
+            'test/use-cases/qunit-test-wrm-web-resource/src/foo-dep_test.js',
+            'expected to find qunit resources for foo-dep.js'
+        );
+    });
+
+    describe('test web-resources', () => {
+        it('should contain dependencies as found in their respective entries', () => {
+            // setup
+            const deps1 = getContent(getDependencies(testEntry1));
+            const deps2 = getContent(getDependencies(testEntry2));
+
+            // check
+            assert.include(deps1, 'some.weird:web-resource');
+            assert.include(deps1, 'foo-bar:baz');
+            assert.include(deps2, 'some.weird:web-resource');
+        });
+
+        it('should contain a mock-require as the first file dependency per entry', () => {
+            // setup
+            const actualFirstResource1 = getName([getResources(testEntry1)[0]])[0];
+            const actualFirstResource2 = getName([getResources(testEntry2)[0]])[0];
+            const expectedFirstResource = 'qunit-require-shim-DEV_PSEUDO_HASH.js';
+
+            // check
+            assert.equal(
+                actualFirstResource1,
+                expectedFirstResource,
+                'unexpected first file in test entry 1 - expected require mock'
+            );
+            assert.equal(
+                actualFirstResource2,
+                expectedFirstResource,
+                'unexpected first file in test entry 2 - expected require mock'
+            );
+        });
+
+        it('should not contain the files from another entry', () => {
+            // setup
+            const actualFirstResource1 = getName(getResources(testEntry1));
+            const actualFirstResource2 = getName(getResources(testEntry2));
+            const expectedOnlyInEntry1 = 'test/use-cases/qunit-test-wrm-web-resource/src/app.js';
+            const expectedOnlyInEntry2 = 'test/use-cases/qunit-test-wrm-web-resource/src/app.2.js';
+
+            // check
+            assert.include(actualFirstResource1, expectedOnlyInEntry1, 'missing resource in first entry');
+            assert.include(actualFirstResource2, expectedOnlyInEntry2, 'missing resource in second entry');
+            assert.notInclude(actualFirstResource1, expectedOnlyInEntry2, 'unexpected resource in second entry');
+            assert.notInclude(actualFirstResource2, expectedOnlyInEntry1, 'unexpected resource in second entry');
+        });
+
+        it('should only contain the files contained in the respective entrypoint', () => {
+            // setup
+            const actualResources1 = getName(getResources(testEntry1));
+            const actualResources2 = getName(getResources(testEntry2));
+            const expectedResources1 = [
+                'qunit-require-shim-DEV_PSEUDO_HASH.js',
+                'ultimate/name/at/runtime.js',
+                'test/use-cases/qunit-test-wrm-web-resource/src/bar-dep.js',
+                'ultimate/name/at/runtime.css',
+                'test/use-cases/qunit-test-wrm-web-resource/src/foo-dep.js',
+                'test/use-cases/qunit-test-wrm-web-resource/src/app.js',
+                'very_async_less.less',
+                'test/use-cases/qunit-test-wrm-web-resource/src/foo-async.js',
+            ];
+            const expectedResources2 = [
+                'qunit-require-shim-DEV_PSEUDO_HASH.js',
+                'ultimate/name/at/runtime.js',
+                'test/use-cases/qunit-test-wrm-web-resource/src/bar-dep.js',
+                'test/use-cases/qunit-test-wrm-web-resource/src/app.2.js',
+            ];
+
+            // check
+            assert.deepEqual(actualResources1, expectedResources1, 'unexpected files in test resources for entry 1');
+            assert.deepEqual(actualResources2, expectedResources2, 'unexpected files in test resources for entry 2');
+        });
+    });
+});

package/test/use-cases/qunit-test-wrm-web-resource/src/app.2.js

@@ -0,0 +1,6 @@
+import $ from 'jquery';
+import bar from './bar-dep';
+
+$(() => {
+    $('body').html('hello world' + bar() + foo());
+});

package/test/use-cases/qunit-test-wrm-web-resource/src/app.js

@@ -0,0 +1,8 @@
+import $ from 'jquery';
+import bar from './bar-dep';
+import foo from './foo-dep';
+
+$(() => {
+    $('body').html('hello world' + bar() + foo());
+    import('./foo-async');
+});

package/test/use-cases/qunit-test-wrm-web-resource/src/bar-dep.js

@@ -0,0 +1,8 @@
+import $ from 'jquery';
+import 'wr-dependency!some.weird:web-resource';
+import 'wr-resource!ultimate/name/at/runtime.js!path/to/my/template.soy';
+
+export default () => {
+    // the MySoyTemplateNamespace would be provided via the soy file. It's currently a side-effect of its generation.
+    document.body.innerHTML = MySoyTemplateNamespace.Example.sayHello({ name: 'world' });
+};

package/test/use-cases/qunit-test-wrm-web-resource/src/bar-dep_test.js

@@ -0,0 +1 @@
+// nothing

package/test/use-cases/qunit-test-wrm-web-resource/src/foo-async.js

@@ -0,0 +1,3 @@
+import 'wr-resource!very_async_less.less!/very/async/less.less';
+
+export default () => console.log('bla');

package/test/use-cases/qunit-test-wrm-web-resource/src/foo-dep.js

@@ -0,0 +1,4 @@
+import 'wr-dependency!foo-bar:baz';
+import 'wr-resource!ultimate/name/at/runtime.css!path/to/my/styles.less';
+
+export default () => console.log('bla');

package/test/use-cases/qunit-test-wrm-web-resource/src/foo-dep_test.js

@@ -0,0 +1 @@
+// nothing

package/test/use-cases/qunit-test-wrm-web-resource/webpack.config.js

@@ -0,0 +1,24 @@
+const path = require('path');
+const WrmPlugin = require('../../../src/WrmPlugin');
+const FRONTEND_SRC_DIR = path.join(__dirname, 'src');
+const OUTPUT_DIR = path.join(__dirname, 'target');
+
+module.exports = {
+    mode: 'development',
+    entry: {
+        app: path.join(FRONTEND_SRC_DIR, 'app.js'),
+        app2: path.join(FRONTEND_SRC_DIR, 'app.2.js'),
+    },
+    plugins: [
+        new WrmPlugin({
+            pluginKey: 'com.atlassian.plugin.test',
+            xmlDescriptors: path.join(OUTPUT_DIR, 'META-INF', 'plugin-descriptor', 'wr-webpack-bundles.xml'),
+            verbose: false,
+            __testGlobs__: ['**/qunit-test-wrm-web-resource/src/*_test.js'],
+        }),
+    ],
+    output: {
+        filename: '[name].js',
+        path: OUTPUT_DIR,
+    },
+};

package/test/use-cases/resource-parameters/resource-parameters.test.js

@@ -0,0 +1,77 @@
+const assert = require('chai').assert;
+const parse = require('xml-parser');
+const webpack = require('webpack');
+const fs = require('fs');
+const path = require('path');
+
+const targetDir = path.join(__dirname, 'target');
+const webresourceOutput = path.join(targetDir, 'META-INF', 'plugin-descriptor', 'wr-webpack-bundles.xml');
+
+describe('resource-parameters', function() {
+    const config = require('./webpack.config.js');
+
+    const byExtension = (resources, ext) => resources.filter(r => r.attributes.name.endsWith(ext))[0];
+
+    let stats;
+    let assets;
+    let resources;
+
+    beforeEach(done => {
+        webpack(config, (err, st) => {
+            stats = st;
+
+            const xmlFile = fs.readFileSync(webresourceOutput, 'utf-8');
+            const results = parse(xmlFile);
+            assets = results.root.children.find(n => n.attributes.key.startsWith('assets'));
+            resources = assets.children.filter(n => n.name === 'resource');
+            done();
+        });
+    });
+
+    it('should add a param to a resource', () => {
+        assert.ok(assets);
+        assert.equal(stats.hasErrors(), false);
+        assert.equal(stats.hasWarnings(), false);
+        assert.equal(resources.length, 3);
+
+        const png = byExtension(resources, '.png');
+        assert.equal(path.extname(png.attributes.name), '.png');
+        assert.equal(png.children.length, 1, 'should contain a "param" child.');
+        assert.equal(png.children[0].attributes.name, 'bar', 'Type of param.');
+        assert.equal(png.children[0].attributes.value, 'baz', 'Value of param.');
+        const svg = byExtension(resources, '.svg');
+        assert.equal(svg.attributes.type, 'download');
+        assert.equal(svg.children.length, 2, 'should contain two "param" children.');
+        assert.equal(svg.children[0].attributes.name, 'content-type', 'Type of param.');
+        assert.equal(svg.children[0].attributes.value, 'image/svg+xml', 'Value of param.');
+        assert.equal(svg.children[1].attributes.name, 'foo', 'Type of param.');
+        assert.equal(svg.children[1].attributes.value, 'bar', 'Value of param.');
+    });
+
+    it('should include the last defined value for a given parameter', () => {
+        const jpg = byExtension(resources, '.jpg');
+        assert.equal(jpg.children.length, 2, 'should contain "param" children.');
+        assert.equal(jpg.children[0].attributes.name, 'bar');
+        assert.equal(jpg.children[1].attributes.name, 'duped');
+        assert.equal(jpg.children[1].attributes.value, 'second', 'Last declared value should win.');
+    });
+
+    it('should add image/svg+xml by default for svg files', done => {
+        const svgConfig = require('./webpack.svg.config');
+        webpack(svgConfig, (err, st) => {
+            stats = st;
+
+            const xmlFile = fs.readFileSync(webresourceOutput, 'utf-8');
+            const results = parse(xmlFile);
+            assets = results.root.children.find(n => n.attributes.key.startsWith('assets'));
+            resources = assets.children.filter(n => n.name === 'resource');
+
+            const svg = byExtension(resources, '.svg');
+            assert.equal(svg.attributes.type, 'download');
+            assert.equal(svg.children.length, 1, 'should contain a "param" child.');
+            assert.equal(svg.children[0].attributes.name, 'content-type', 'Type of param.');
+            assert.equal(svg.children[0].attributes.value, 'image/svg+xml', 'Value of param.');
+            done();
+        });
+    });
+});

package/test/use-cases/resource-parameters/src/app.js

@@ -0,0 +1,12 @@
+import logo from './ice.png';
+import logo2 from './rect.svg';
+import logo3 from './ice2.jpg';
+
+const image = new Image();
+image.src = logo;
+
+const image2 = new Image();
+image2.src = logo2;
+
+const image3 = new Image();
+image3.src = logo3;

package/test/use-cases/resource-parameters/src/rect.svg

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="48px" height="64px" viewBox="0 0 48 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <rect width="48" height="64" style="fill:rgb(0,0,255)" />
+</svg>

package/test/use-cases/resource-parameters/webpack.config.js

@@ -0,0 +1,62 @@
+const path = require('path');
+const WrmPlugin = require('../../../src/WrmPlugin');
+const FRONTEND_SRC_DIR = path.join(__dirname, 'src');
+const OUTPUT_DIR = path.join(__dirname, 'target');
+
+module.exports = {
+    mode: 'development',
+    entry: {
+        app: path.join(FRONTEND_SRC_DIR, 'app.js'),
+    },
+    module: {
+        rules: [
+            {
+                test: /\.(png|svg|jpg)$/,
+                loader: 'file-loader',
+            },
+        ],
+    },
+    plugins: [
+        new WrmPlugin({
+            pluginKey: 'com.atlassian.plugin.test',
+            xmlDescriptors: path.join(OUTPUT_DIR, 'META-INF', 'plugin-descriptor', 'wr-webpack-bundles.xml'),
+            verbose: false,
+            resourceParamMap: {
+                svg: [
+                    {
+                        name: 'content-type',
+                        value: 'image/svg+xml',
+                    },
+                    {
+                        name: 'foo',
+                        value: 'bar',
+                    },
+                ],
+                png: [
+                    {
+                        name: 'bar',
+                        value: 'baz',
+                    },
+                ],
+                jpg: [
+                    {
+                        name: 'duped',
+                        value: 'first',
+                    },
+                    {
+                        name: 'bar',
+                        value: 'baz',
+                    },
+                    {
+                        name: 'duped',
+                        value: 'second',
+                    },
+                ],
+            },
+        }),
+    ],
+    output: {
+        filename: '[name].js',
+        path: OUTPUT_DIR,
+    },
+};

package/test/use-cases/resource-parameters/webpack.svg.config.js

@@ -0,0 +1,30 @@
+const path = require('path');
+const WrmPlugin = require('../../../src/WrmPlugin');
+const FRONTEND_SRC_DIR = path.join(__dirname, 'src');
+const OUTPUT_DIR = path.join(__dirname, 'target');
+
+module.exports = {
+    mode: 'development',
+    entry: {
+        app: path.join(FRONTEND_SRC_DIR, 'app.js'),
+    },
+    module: {
+        rules: [
+            {
+                test: /\.(png|svg)$/,
+                loader: 'file-loader',
+            },
+        ],
+    },
+    plugins: [
+        new WrmPlugin({
+            pluginKey: 'com.atlassian.plugin.test',
+            xmlDescriptors: path.join(OUTPUT_DIR, 'META-INF', 'plugin-descriptor', 'wr-webpack-bundles.xml'),
+            verbose: false,
+        }),
+    ],
+    output: {
+        filename: '[name].js',
+        path: OUTPUT_DIR,
+    },
+};