Skip to content

Commit

Permalink
tgui maintenance chores (#60859)
Browse files Browse the repository at this point in the history
## About The Pull Request

**Upgrades:**

- Yarn 3.0
- TypeScript 4.3
- Sass 1.37
  - Required some refactoring of `/` into `math.div()` in CSS

**Dependency removals:**

- Removed ESM package, see: standard-things/esm#902

I initially thought it was impossible to stop relying on this package, but fortunately, ES module support in Node 12+ now comes standard and I only had to convert the very few external module imports to `require()` (because Yarn PnP).

I also moved `logging.js` directly into `tgui-dev-server` package, because that's where it is used. One less internal dependency.

**Sidegrades:**

- Removed creation of a common tgui chunk, because in practice it creates unnecessary complexity (devs sometimes get a white screen due to this chunk being invalid) and doesn't really save that much data on CDN, and **definitely** doesn't make tgui load faster.

I think that is all. I tested it a bit and everything seemingly works.
  • Loading branch information
stylemistake committed Aug 16, 2021
1 parent a7de487 commit 9bbabfe
Show file tree
Hide file tree
Showing 51 changed files with 4,042 additions and 3,767 deletions.
6 changes: 0 additions & 6 deletions code/modules/asset_cache/asset_list_items.dm
@@ -1,11 +1,5 @@
//DEFINITIONS FOR ASSET DATUMS START HERE.

/datum/asset/simple/tgui_common
keep_local_name = TRUE
assets = list(
"tgui-common.bundle.js" = file("tgui/public/tgui-common.bundle.js"),
)

/datum/asset/simple/tgui
keep_local_name = TRUE
assets = list(
Expand Down
1 change: 0 additions & 1 deletion code/modules/tgui/tgui.dm
Expand Up @@ -92,7 +92,6 @@
window.initialize(
fancy = user.client.prefs.tgui_fancy,
inline_assets = list(
get_asset_datum(/datum/asset/simple/tgui_common),
get_asset_datum(/datum/asset/simple/tgui),
))
else
Expand Down
1 change: 0 additions & 1 deletion code/modules/tgui_panel/tgui_panel.dm
Expand Up @@ -43,7 +43,6 @@
initialized_at = world.time
// Perform a clean initialization
window.initialize(inline_assets = list(
get_asset_datum(/datum/asset/simple/tgui_common),
get_asset_datum(/datum/asset/simple/tgui_panel),
))
window.send_asset(get_asset_datum(/datum/asset/simple/namespaced/fontawesome))
Expand Down
356 changes: 321 additions & 35 deletions tgui/.yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs

Large diffs are not rendered by default.

55 changes: 0 additions & 55 deletions tgui/.yarn/releases/yarn-2.4.1.cjs

This file was deleted.

631 changes: 631 additions & 0 deletions tgui/.yarn/releases/yarn-3.0.1.cjs

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion tgui/.yarn/sdks/eslint/bin/eslint.js
Expand Up @@ -4,7 +4,7 @@ const {existsSync} = require(`fs`);
const {createRequire, createRequireFromPath} = require(`module`);
const {resolve} = require(`path`);

const relPnpApiPath = "../../../../.pnp.js";
const relPnpApiPath = "../../../../.pnp.cjs";

const absPnpApiPath = resolve(__dirname, relPnpApiPath);
const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
Expand Down
2 changes: 1 addition & 1 deletion tgui/.yarn/sdks/eslint/lib/api.js
Expand Up @@ -4,7 +4,7 @@ const {existsSync} = require(`fs`);
const {createRequire, createRequireFromPath} = require(`module`);
const {resolve} = require(`path`);

const relPnpApiPath = "../../../../.pnp.js";
const relPnpApiPath = "../../../../.pnp.cjs";

const absPnpApiPath = resolve(__dirname, relPnpApiPath);
const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
Expand Down
2 changes: 1 addition & 1 deletion tgui/.yarn/sdks/eslint/package.json
@@ -1,6 +1,6 @@
{
"name": "eslint",
"version": "7.21.0-pnpify",
"version": "7.32.0-sdk",
"main": "./lib/api.js",
"type": "commonjs"
}
4 changes: 2 additions & 2 deletions tgui/.yarn/sdks/integrations.yml
@@ -1,5 +1,5 @@
# This file is automatically generated by PnPify.
# Manual changes will be lost!
# This file is automatically generated by @yarnpkg/sdks.
# Manual changes might be lost!

integrations:
- vscode
2 changes: 1 addition & 1 deletion tgui/.yarn/sdks/typescript/bin/tsc
Expand Up @@ -4,7 +4,7 @@ const {existsSync} = require(`fs`);
const {createRequire, createRequireFromPath} = require(`module`);
const {resolve} = require(`path`);

const relPnpApiPath = "../../../../.pnp.js";
const relPnpApiPath = "../../../../.pnp.cjs";

const absPnpApiPath = resolve(__dirname, relPnpApiPath);
const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
Expand Down
2 changes: 1 addition & 1 deletion tgui/.yarn/sdks/typescript/bin/tsserver
Expand Up @@ -4,7 +4,7 @@ const {existsSync} = require(`fs`);
const {createRequire, createRequireFromPath} = require(`module`);
const {resolve} = require(`path`);

const relPnpApiPath = "../../../../.pnp.js";
const relPnpApiPath = "../../../../.pnp.cjs";

const absPnpApiPath = resolve(__dirname, relPnpApiPath);
const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
Expand Down
2 changes: 1 addition & 1 deletion tgui/.yarn/sdks/typescript/lib/tsc.js
Expand Up @@ -4,7 +4,7 @@ const {existsSync} = require(`fs`);
const {createRequire, createRequireFromPath} = require(`module`);
const {resolve} = require(`path`);

const relPnpApiPath = "../../../../.pnp.js";
const relPnpApiPath = "../../../../.pnp.cjs";

const absPnpApiPath = resolve(__dirname, relPnpApiPath);
const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
Expand Down
84 changes: 65 additions & 19 deletions tgui/.yarn/sdks/typescript/lib/tsserver.js
Expand Up @@ -4,15 +4,22 @@ const {existsSync} = require(`fs`);
const {createRequire, createRequireFromPath} = require(`module`);
const {resolve} = require(`path`);

const relPnpApiPath = "../../../../.pnp.js";
const relPnpApiPath = "../../../../.pnp.cjs";

const absPnpApiPath = resolve(__dirname, relPnpApiPath);
const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);

const moduleWrapper = tsserver => {
if (!process.versions.pnp) {
return tsserver;
}

const {isAbsolute} = require(`path`);
const pnpApi = require(`pnpapi`);

const isVirtual = str => str.match(/\/(\$\$virtual|__virtual__)\//);
const normalize = str => str.replace(/\\/g, `/`).replace(/^\/?/, `/`);

const dependencyTreeRoots = new Set(pnpApi.getDependencyTreeRoots().map(locator => {
return `${locator.name}@${locator.reference}`;
}));
Expand All @@ -23,9 +30,9 @@ const moduleWrapper = tsserver => {

function toEditorPath(str) {
// We add the `zip:` prefix to both `.zip/` paths and virtual paths
if (isAbsolute(str) && !str.match(/^\^zip:/) && (str.match(/\.zip\//) || str.match(/\$\$virtual\//))) {
if (isAbsolute(str) && !str.match(/^\^zip:/) && (str.match(/\.zip\//) || isVirtual(str))) {
// We also take the opportunity to turn virtual paths into physical ones;
// this makes is much easier to work with workspaces that list peer
// this makes it much easier to work with workspaces that list peer
// dependencies, since otherwise Ctrl+Click would bring us to the virtual
// file instances instead of the real ones.
//
Expand All @@ -34,26 +41,49 @@ const moduleWrapper = tsserver => {
// with peer dep (otherwise jumping into react-dom would show resolution
// errors on react).
//
const resolved = pnpApi.resolveVirtual(str);
const resolved = isVirtual(str) ? pnpApi.resolveVirtual(str) : str;
if (resolved) {
const locator = pnpApi.findPackageLocator(resolved);
if (locator && dependencyTreeRoots.has(`${locator.name}@${locator.reference}`)) {
str = resolved;
str = resolved;
}
}

str = str.replace(/\\/g, `/`)
str = str.replace(/^\/?/, `/`);
str = normalize(str);

// Absolute VSCode `Uri.fsPath`s need to start with a slash.
// VSCode only adds it automatically for supported schemes,
// so we have to do it manually for the `zip` scheme.
// The path needs to start with a caret otherwise VSCode doesn't handle the protocol
//
// Ref: https://github.com/microsoft/vscode/issues/105014#issuecomment-686760910
//
if (str.match(/\.zip\//)) {
str = `${isVSCode ? `^` : ``}zip:${str}`;
switch (hostInfo) {
// Absolute VSCode `Uri.fsPath`s need to start with a slash.
// VSCode only adds it automatically for supported schemes,
// so we have to do it manually for the `zip` scheme.
// The path needs to start with a caret otherwise VSCode doesn't handle the protocol
//
// Ref: https://github.com/microsoft/vscode/issues/105014#issuecomment-686760910
//
case `vscode`: {
str = `^zip:${str}`;
} break;

// To make "go to definition" work,
// We have to resolve the actual file system path from virtual path
// and convert scheme to supported by [vim-rzip](https://github.com/lbrayner/vim-rzip)
case `coc-nvim`: {
str = normalize(resolved).replace(/\.zip\//, `.zip::`);
str = resolve(`zipfile:${str}`);
} break;

// Support neovim native LSP and [typescript-language-server](https://github.com/theia-ide/typescript-language-server)
// We have to resolve the actual file system path from virtual path,
// everything else is up to neovim
case `neovim`: {
str = normalize(resolved).replace(/\.zip\//, `.zip::`);
str = `zipfile:${str}`;
} break;

default: {
str = `zip:${str}`;
} break;
}
}
}

Expand All @@ -66,25 +96,39 @@ const moduleWrapper = tsserver => {
: str.replace(/^\^?zip:/, ``);
}

// Force enable 'allowLocalPluginLoads'
// TypeScript tries to resolve plugins using a path relative to itself
// which doesn't work when using the global cache
// https://github.com/microsoft/TypeScript/blob/1b57a0395e0bff191581c9606aab92832001de62/src/server/project.ts#L2238
// VSCode doesn't want to enable 'allowLocalPluginLoads' due to security concerns but
// TypeScript already does local loads and if this code is running the user trusts the workspace
// https://github.com/microsoft/vscode/issues/45856
const ConfiguredProject = tsserver.server.ConfiguredProject;
const {enablePluginsWithOptions: originalEnablePluginsWithOptions} = ConfiguredProject.prototype;
ConfiguredProject.prototype.enablePluginsWithOptions = function() {
this.projectService.allowLocalPluginLoads = true;
return originalEnablePluginsWithOptions.apply(this, arguments);
};

// And here is the point where we hijack the VSCode <-> TS communications
// by adding ourselves in the middle. We locate everything that looks
// like an absolute path of ours and normalize it.

const Session = tsserver.server.Session;
const {onMessage: originalOnMessage, send: originalSend} = Session.prototype;
let isVSCode = false;
let hostInfo = `unknown`;

return Object.assign(Session.prototype, {
Object.assign(Session.prototype, {
onMessage(/** @type {string} */ message) {
const parsedMessage = JSON.parse(message)

if (
parsedMessage != null &&
typeof parsedMessage === `object` &&
parsedMessage.arguments &&
parsedMessage.arguments.hostInfo === `vscode`
typeof parsedMessage.arguments.hostInfo === `string`
) {
isVSCode = true;
hostInfo = parsedMessage.arguments.hostInfo;
}

return originalOnMessage.call(this, JSON.stringify(parsedMessage, (key, value) => {
Expand All @@ -98,6 +142,8 @@ const moduleWrapper = tsserver => {
})));
}
});

return tsserver;
};

if (existsSync(absPnpApiPath)) {
Expand Down
157 changes: 157 additions & 0 deletions tgui/.yarn/sdks/typescript/lib/tsserverlibrary.js
@@ -0,0 +1,157 @@
#!/usr/bin/env node

const {existsSync} = require(`fs`);
const {createRequire, createRequireFromPath} = require(`module`);
const {resolve} = require(`path`);

const relPnpApiPath = "../../../../.pnp.cjs";

const absPnpApiPath = resolve(__dirname, relPnpApiPath);
const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);

const moduleWrapper = tsserver => {
if (!process.versions.pnp) {
return tsserver;
}

const {isAbsolute} = require(`path`);
const pnpApi = require(`pnpapi`);

const isVirtual = str => str.match(/\/(\$\$virtual|__virtual__)\//);
const normalize = str => str.replace(/\\/g, `/`).replace(/^\/?/, `/`);

const dependencyTreeRoots = new Set(pnpApi.getDependencyTreeRoots().map(locator => {
return `${locator.name}@${locator.reference}`;
}));

// VSCode sends the zip paths to TS using the "zip://" prefix, that TS
// doesn't understand. This layer makes sure to remove the protocol
// before forwarding it to TS, and to add it back on all returned paths.

function toEditorPath(str) {
// We add the `zip:` prefix to both `.zip/` paths and virtual paths
if (isAbsolute(str) && !str.match(/^\^zip:/) && (str.match(/\.zip\//) || isVirtual(str))) {
// We also take the opportunity to turn virtual paths into physical ones;
// this makes it much easier to work with workspaces that list peer
// dependencies, since otherwise Ctrl+Click would bring us to the virtual
// file instances instead of the real ones.
//
// We only do this to modules owned by the the dependency tree roots.
// This avoids breaking the resolution when jumping inside a vendor
// with peer dep (otherwise jumping into react-dom would show resolution
// errors on react).
//
const resolved = isVirtual(str) ? pnpApi.resolveVirtual(str) : str;
if (resolved) {
const locator = pnpApi.findPackageLocator(resolved);
if (locator && dependencyTreeRoots.has(`${locator.name}@${locator.reference}`)) {
str = resolved;
}
}

str = normalize(str);

if (str.match(/\.zip\//)) {
switch (hostInfo) {
// Absolute VSCode `Uri.fsPath`s need to start with a slash.
// VSCode only adds it automatically for supported schemes,
// so we have to do it manually for the `zip` scheme.
// The path needs to start with a caret otherwise VSCode doesn't handle the protocol
//
// Ref: https://github.com/microsoft/vscode/issues/105014#issuecomment-686760910
//
case `vscode`: {
str = `^zip:${str}`;
} break;

// To make "go to definition" work,
// We have to resolve the actual file system path from virtual path
// and convert scheme to supported by [vim-rzip](https://github.com/lbrayner/vim-rzip)
case `coc-nvim`: {
str = normalize(resolved).replace(/\.zip\//, `.zip::`);
str = resolve(`zipfile:${str}`);
} break;

// Support neovim native LSP and [typescript-language-server](https://github.com/theia-ide/typescript-language-server)
// We have to resolve the actual file system path from virtual path,
// everything else is up to neovim
case `neovim`: {
str = normalize(resolved).replace(/\.zip\//, `.zip::`);
str = `zipfile:${str}`;
} break;

default: {
str = `zip:${str}`;
} break;
}
}
}

return str;
}

function fromEditorPath(str) {
return process.platform === `win32`
? str.replace(/^\^?zip:\//, ``)
: str.replace(/^\^?zip:/, ``);
}

// Force enable 'allowLocalPluginLoads'
// TypeScript tries to resolve plugins using a path relative to itself
// which doesn't work when using the global cache
// https://github.com/microsoft/TypeScript/blob/1b57a0395e0bff191581c9606aab92832001de62/src/server/project.ts#L2238
// VSCode doesn't want to enable 'allowLocalPluginLoads' due to security concerns but
// TypeScript already does local loads and if this code is running the user trusts the workspace
// https://github.com/microsoft/vscode/issues/45856
const ConfiguredProject = tsserver.server.ConfiguredProject;
const {enablePluginsWithOptions: originalEnablePluginsWithOptions} = ConfiguredProject.prototype;
ConfiguredProject.prototype.enablePluginsWithOptions = function() {
this.projectService.allowLocalPluginLoads = true;
return originalEnablePluginsWithOptions.apply(this, arguments);
};

// And here is the point where we hijack the VSCode <-> TS communications
// by adding ourselves in the middle. We locate everything that looks
// like an absolute path of ours and normalize it.

const Session = tsserver.server.Session;
const {onMessage: originalOnMessage, send: originalSend} = Session.prototype;
let hostInfo = `unknown`;

Object.assign(Session.prototype, {
onMessage(/** @type {string} */ message) {
const parsedMessage = JSON.parse(message)

if (
parsedMessage != null &&
typeof parsedMessage === `object` &&
parsedMessage.arguments &&
typeof parsedMessage.arguments.hostInfo === `string`
) {
hostInfo = parsedMessage.arguments.hostInfo;
}

return originalOnMessage.call(this, JSON.stringify(parsedMessage, (key, value) => {
return typeof value === `string` ? fromEditorPath(value) : value;
}));
},

send(/** @type {any} */ msg) {
return originalSend.call(this, JSON.parse(JSON.stringify(msg, (key, value) => {
return typeof value === `string` ? toEditorPath(value) : value;
})));
}
});

return tsserver;
};

if (existsSync(absPnpApiPath)) {
if (!process.versions.pnp) {
// Setup the environment to be able to require typescript/lib/tsserverlibrary.js
require(absPnpApiPath).setup();
}
}

// Defer to the real typescript/lib/tsserverlibrary.js your application uses
module.exports = moduleWrapper(absRequire(`typescript/lib/tsserverlibrary.js`));

0 comments on commit 9bbabfe

Please sign in to comment.