Skip to content
This repository has been archived by the owner on Nov 16, 2023. It is now read-only.

Upgrading to webpack 4.x #773

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
209 changes: 103 additions & 106 deletions config/env.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,125 +4,124 @@ const { startCase } = require('lodash');

/** NOTE: when adding local storage keys here, remember to add them for IntelliSense's sake in "ICompiledPlaygroundInfo" in playground.d.ts */
const localStorageKeys = {
dummyUnusedKey: 'plyaground_dummy_unused_key',
log: 'playground_log',
hostSnippets_parameterized: 'playground_{0}_snippets',
settings: 'playground_settings',
originEnvironmentUrl: 'playground_origin_environment_url',
redirectEnvironmentUrl: 'playground_redirect_environment_url',
wacUrl: 'playground_wac_url',
experimentationFlags: 'playground_experimentation_flags',
trustedSnippets: 'playground_trusted_snippets',
customFunctionsLastHeartbeatTimestamp: 'playground_custom_functions_last_heartbeat_timestamp',
customFunctionsLastUpdatedCodeTimestamp: 'playground_custom_functions_last_updated_code_timestamp',
customFunctionsCurrentlyRunningTimestamp: 'playground_custom_functions_currently_running_timestamp',
logLastHeartbeatTimestamp: 'playground_log_last_heartbeat_timestamp',
lastPerfNumbersTimestamp: 'playground_last_perf_numbers_timestamp',
language: 'playground_language'
dummyUnusedKey: 'plyaground_dummy_unused_key',
log: 'playground_log',
hostSnippets_parameterized: 'playground_{0}_snippets',
settings: 'playground_settings',
originEnvironmentUrl: 'playground_origin_environment_url',
redirectEnvironmentUrl: 'playground_redirect_environment_url',
wacUrl: 'playground_wac_url',
experimentationFlags: 'playground_experimentation_flags',
trustedSnippets: 'playground_trusted_snippets',
customFunctionsLastHeartbeatTimestamp: 'playground_custom_functions_last_heartbeat_timestamp',
customFunctionsLastUpdatedCodeTimestamp: 'playground_custom_functions_last_updated_code_timestamp',
customFunctionsCurrentlyRunningTimestamp: 'playground_custom_functions_currently_running_timestamp',
logLastHeartbeatTimestamp: 'playground_log_last_heartbeat_timestamp',
lastPerfNumbersTimestamp: 'playground_last_perf_numbers_timestamp',
language: 'playground_language'
};

const sessionStorageKeys = {
environmentCache: 'playground_cache',
intelliSenseCache: 'playground_intellisense'
environmentCache: 'playground_cache',
intelliSenseCache: 'playground_intellisense'
};

const build = (() => {
return {
name: startCase(name),
version: version,
timestamp: moment().utc().valueOf(),
humanReadableTimestamp: moment().utc().format('YYYY-MM-DD HH:mm a') + ' UTC',
author: author
};
return {
name: startCase(name),
version: version,
timestamp: moment().utc().valueOf(),
humanReadableTimestamp: moment().utc().format('YYYY-MM-DD HH:mm a') + ' UTC',
author: author
};
})();

const thirdPartyAADAppClientId = 'd56fb06a-74be-4bd7-8ede-cbf2ea737328';

const config = {
local: {
name: 'LOCAL',
clientId: '',
clientSecretLocalHost: '',
instrumentationKey: null,
editorUrl: 'https://localhost:3000',
tokenUrl: 'https://localhost:3200/auth',
runnerUrl: 'https://localhost:3200',
samplesUrl: 'https://raw.githubusercontent.com/OfficeDev/office-js-snippets/deploy-beta',
feedbackUrl: 'https://github.com/OfficeDev/script-lab/issues',
thirdPartyAADAppClientId,
},
edge: {
name: 'EDGE',
clientId: 'fb706d86cd846cea7baf',
instrumentationKey: '07a066dc-d67f-44af-8f77-59cb6ee246a8',
editorUrl: 'https://bornholm-edge.azurewebsites.net',
tokenUrl: 'https://bornholm-runner-edge.azurewebsites.net/auth',
runnerUrl: 'https://bornholm-runner-edge.azurewebsites.net',
samplesUrl: 'https://raw.githubusercontent.com/OfficeDev/office-js-snippets/deploy-beta',
feedbackUrl: 'https://github.com/OfficeDev/script-lab/issues',
thirdPartyAADAppClientId,
},
insiders: {
name: 'INSIDERS',
clientId: '786ba422740568d98ce3',
instrumentationKey: 'b3f1f065-02a9-49d3-b75c-4586659f51ef',
editorUrl: 'https://bornholm-insiders.azurewebsites.net',
tokenUrl: 'https://bornholm-runner-insiders.azurewebsites.net/auth',
runnerUrl: 'https://bornholm-runner-insiders.azurewebsites.net',
samplesUrl: 'https://raw.githubusercontent.com/OfficeDev/office-js-snippets/deploy-beta',
feedbackUrl: 'https://forms.office.com/Pages/ResponsePage.aspx?id=v4j5cvGGr0GRqy180BHbR_IQfl6RcdlChED7PZI6qXNURUo2UFBUR1YxMkwxWFBLUTRMUE9HRENOWi4u',
thirdPartyAADAppClientId,
},
production: {
name: 'PRODUCTION',
clientId: '55031174553ee45f92f4',
instrumentationKey: '8e0b6b12-8d5e-4710-841d-7996a913f14b',
editorUrl: 'https://script-lab.azureedge.net',
tokenUrl: 'https://script-lab-runner.azureedge.net/auth',
runnerUrl: 'https://script-lab-runner.azureedge.net',
samplesUrl: 'https://raw.githubusercontent.com/OfficeDev/office-js-snippets/deploy-prod',
feedbackUrl: 'https://github.com/OfficeDev/script-lab/issues',
thirdPartyAADAppClientId,
}
local: {
name: 'LOCAL',
clientId: '',
clientSecretLocalHost: '',
instrumentationKey: null,
editorUrl: 'https://localhost:3000',
tokenUrl: 'https://localhost:3200/auth',
runnerUrl: 'https://localhost:3200',
samplesUrl: 'https://raw.githubusercontent.com/OfficeDev/office-js-snippets/deploy-beta',
feedbackUrl: 'https://github.com/OfficeDev/script-lab/issues',
thirdPartyAADAppClientId,
},
edge: {
name: 'EDGE',
clientId: 'fb706d86cd846cea7baf',
instrumentationKey: '07a066dc-d67f-44af-8f77-59cb6ee246a8',
editorUrl: 'https://bornholm-edge.azurewebsites.net',
tokenUrl: 'https://bornholm-runner-edge.azurewebsites.net/auth',
runnerUrl: 'https://bornholm-runner-edge.azurewebsites.net',
samplesUrl: 'https://raw.githubusercontent.com/OfficeDev/office-js-snippets/deploy-beta',
feedbackUrl: 'https://github.com/OfficeDev/script-lab/issues',
thirdPartyAADAppClientId,
},
insiders: {
name: 'INSIDERS',
clientId: '786ba422740568d98ce3',
instrumentationKey: 'b3f1f065-02a9-49d3-b75c-4586659f51ef',
editorUrl: 'https://bornholm-insiders.azurewebsites.net',
tokenUrl: 'https://bornholm-runner-insiders.azurewebsites.net/auth',
runnerUrl: 'https://bornholm-runner-insiders.azurewebsites.net',
samplesUrl: 'https://raw.githubusercontent.com/OfficeDev/office-js-snippets/deploy-beta',
feedbackUrl: 'https://forms.office.com/Pages/ResponsePage.aspx?id=v4j5cvGGr0GRqy180BHbR_IQfl6RcdlChED7PZI6qXNURUo2UFBUR1YxMkwxWFBLUTRMUE9HRENOWi4u',
thirdPartyAADAppClientId,
},
production: {
name: 'PRODUCTION',
clientId: '55031174553ee45f92f4',
instrumentationKey: '8e0b6b12-8d5e-4710-841d-7996a913f14b',
editorUrl: 'https://script-lab.azureedge.net',
tokenUrl: 'https://script-lab-runner.azureedge.net/auth',
runnerUrl: 'https://script-lab-runner.azureedge.net',
samplesUrl: 'https://raw.githubusercontent.com/OfficeDev/office-js-snippets/deploy-prod',
feedbackUrl: 'https://github.com/OfficeDev/script-lab/issues',
thirdPartyAADAppClientId,
}
};

// NOTE: Any changes to this data structure should also be copied to `playground.d.ts`
const safeExternalUrls = {
playground_help: 'https://github.com/OfficeDev/script-lab/blob/master/README.md',
ask: 'https://stackoverflow.com/questions/tagged/office-js',
excel_api: 'https://dev.office.com/reference/add-ins/excel/excel-add-ins-reference-overview',
word_api: 'https://dev.office.com/reference/add-ins/word/word-add-ins-reference-overview',
onenote_api: 'https://dev.office.com/reference/add-ins/onenote/onenote-add-ins-javascript-reference',
outlook_api: 'https://docs.microsoft.com/en-us/outlook/add-ins/reference',
powepoint_api: 'https://dev.office.com/docs/add-ins/powerpoint/powerpoint-add-ins',
project_api: 'https://dev.office.com/reference/add-ins/shared/projectdocument.projectdocument',
generic_api: 'https://dev.office.com/reference/add-ins/javascript-api-for-office'
playground_help: 'https://github.com/OfficeDev/script-lab/blob/master/README.md',
ask: 'https://stackoverflow.com/questions/tagged/office-js',
excel_api: 'https://dev.office.com/reference/add-ins/excel/excel-add-ins-reference-overview',
word_api: 'https://dev.office.com/reference/add-ins/word/word-add-ins-reference-overview',
onenote_api: 'https://dev.office.com/reference/add-ins/onenote/onenote-add-ins-javascript-reference',
outlook_api: 'https://docs.microsoft.com/en-us/outlook/add-ins/reference',
powepoint_api: 'https://dev.office.com/docs/add-ins/powerpoint/powerpoint-add-ins',
project_api: 'https://dev.office.com/reference/add-ins/shared/projectdocument.projectdocument',
generic_api: 'https://dev.office.com/reference/add-ins/javascript-api-for-office'
};

const experimentationFlagsDefaults = {
customFunctions: false,
customFunctionsShowDebugLog: false
customFunctions: false,
customFunctionsShowDebugLog: false
};

class RedirectPlugin {
apply(compiler) {
compiler.plugin('compilation', (compilation) => {
compilation.plugin('html-webpack-plugin-before-html-processing', (htmlPluginData, callback) => {
let headOpeningTag = '<head>';
let htmlHead = htmlPluginData.html.match(headOpeningTag);

let { originEnvironmentUrl, redirectEnvironmentUrl } = localStorageKeys;

const validRedirectLocations = [];
for (var envName in config) {
validRedirectLocations.push(config[envName].editorUrl);
}

if (htmlHead && htmlHead.length > 0) {
htmlHead = htmlHead.index;
htmlPluginData.html = htmlPluginData.html.slice(0, htmlHead) +
headOpeningTag +
`
apply(compiler) {

compiler.hooks.compilation.tap('html-webpack-plugin-before-html-processing', htmlPluginData => {
let headOpeningTag = '<head>';
let htmlHead = htmlPluginData.html.match(headOpeningTag);
let { originEnvironmentUrl, redirectEnvironmentUrl } = localStorageKeys;

const validRedirectLocations = [];
for (var envName in config) {
validRedirectLocations.push(config[envName].editorUrl);
}

if (htmlHead && htmlHead.length > 0) {
htmlHead = htmlHead.index;
htmlPluginData.html = htmlPluginData.html.slice(0, htmlHead) +
headOpeningTag +
`
<script>
(function() {
try {
Expand Down Expand Up @@ -211,22 +210,20 @@ class RedirectPlugin {
})();
</script>
` +
htmlPluginData.html.slice(htmlHead + headOpeningTag.length);
}
callback(null, htmlPluginData);
});
});
}
htmlPluginData.html.slice(htmlHead + headOpeningTag.length);
}
return htmlPluginData;
});
}
}


exports.build = build;
exports.config = config;
exports.safeExternalUrls = safeExternalUrls;
exports.localStorageKeys = localStorageKeys;
exports.sessionStorageKeys = sessionStorageKeys;
exports.experimentationFlagsDefaults = experimentationFlagsDefaults;
exports.RedirectPlugin = RedirectPlugin;
// exports.RedirectPlugin = RedirectPlugin;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why commented out? We need it to be able to switch between alpha/beta/prod...


// NOTE: Data in this file gets propagated to JS on client pages
// via the "new webpack.DefinePlugin({ PLAYGROUND: ... }) definition
Expand Down
102 changes: 50 additions & 52 deletions config/package.version.substitutions.plugin.js
Original file line number Diff line number Diff line change
@@ -1,72 +1,70 @@
const { dependencies } = require('../package.json');

function getVersionedPackageNames(packageNames) {
let validNumericRegex = /^\d+\.\d+\.\d+.*$/;
/*
passes:
2.3.4
222.33.444
1.1.2-private
1.1.2-private.0
let validNumericRegex = /^\d+\.\d+\.\d+.*$/;
/*
passes:
2.3.4
222.33.444
1.1.2-private
1.1.2-private.0

fails:
^1.3.0
2.2.*
*/
fails:
^1.3.0
2.2.*
*/

let result = {};
packageNames.forEach(item => {
let versionNumberWithDots = dependencies[item];
if (!validNumericRegex.test(versionNumberWithDots)) {
throw new Error(`Package number for "${item}: ${versionNumberWithDots}" must start with a #.#.# format, ` +
`pointing at a specific version.`);
}
let result = {};
packageNames.forEach(item => {
let versionNumberWithDots = dependencies[item];
if (!validNumericRegex.test(versionNumberWithDots)) {
throw new Error(`Package number for "${item}: ${versionNumberWithDots}" must start with a #.#.# format, ` +
`pointing at a specific version.`);
}

let concatenated = item + '-' + versionNumberWithDots;
let filesafeFolderName = concatenated.toLowerCase()
.replace(/[^0-9a-zA-Z]/g, '-') /* replace any non-alphanumeric with a hyphen */
.replace(/-+/g, '-') /* and ensure that don't end up with -- or --, just a single hyphen */
.replace(/^-+/, '') /* trim any hyphens before */
.replace(/-+$/, '') /* and trim any at the end, as well */;
let concatenated = item + '-' + versionNumberWithDots;
let filesafeFolderName = concatenated.toLowerCase()
.replace(/[^0-9a-zA-Z]/g, '-') /* replace any non-alphanumeric with a hyphen */
.replace(/-+/g, '-') /* and ensure that don't end up with -- or --, just a single hyphen */
.replace(/^-+/, '') /* trim any hyphens before */
.replace(/-+$/, '') /* and trim any at the end, as well */;

result[item] = filesafeFolderName;
});
return result;
result[item] = filesafeFolderName;
});
return result;
}

class VersionedPackageSubstitutionsPlugin {
constructor(packageNames) {
this._packageNames = packageNames
}
constructor(packageNames) {
this._packageNames = packageNames
}

apply(compiler) {
compiler.plugin('compilation', (compilation) => {
compilation.plugin('html-webpack-plugin-before-html-processing', (htmlPluginData, callback) => {
let headOpeningTag = '<head>';
let htmlHead = htmlPluginData.html.match(headOpeningTag);
apply(compiler) {
compiler.hooks.compilation.tap('html-webpack-plugin-before-html-processing', htmlPluginData => {
let headOpeningTag = '<head>';
let htmlHead = htmlPluginData.html.match(headOpeningTag);

if (htmlHead && htmlHead.length > 0) {
htmlHead = htmlHead.index;
htmlPluginData.html = htmlPluginData.html.slice(0, htmlHead)
+ headOpeningTag +
`
if (htmlHead && htmlHead.length > 0) {
htmlHead = htmlHead.index;
htmlPluginData.html = htmlPluginData.html.slice(0, htmlHead)
+ headOpeningTag +
`
<script>
window.versionedPackageNames = ${JSON.stringify(this._packageNames)};
</script>
` +
htmlPluginData.html.slice(htmlHead + headOpeningTag.length);
}
` +
htmlPluginData.html.slice(htmlHead + headOpeningTag.length);
}

htmlPluginData.html = htmlPluginData.html.replace(
/{{{versionedPackageNames\[['"](.+)['"]\]}}}/g,
(fullMatch, group1) => this._packageNames[group1]
);
htmlPluginData.html = htmlPluginData.html.replace(
/{{{versionedPackageNames\[['"](.+)['"]\]}}}/g,
(fullMatch, group1) => this._packageNames[group1]
);

callback(null, htmlPluginData);
});
});
}
return htmlPluginData;
});
}
}

exports.getVersionedPackageNames = getVersionedPackageNames;
exports.VersionedPackageSubstitutionsPlugin = VersionedPackageSubstitutionsPlugin;
// exports.VersionedPackageSubstitutionsPlugin = VersionedPackageSubstitutionsPlugin;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Likewise, is needed for a few of the pages (TryIt and CustomFunctionsDashboard)

Loading