Skip to content

Commit 4977f38

Browse files
tanner-reitstanner-reits
authored
chore(compiler/runtime): remove CSS var shim & patchEsm() (#4419)
* remove CSS var shim & patchEsm * remove `cssVarShim` references from some tests * remove some errant code * add field removal to breaking changes * fix build error
1 parent 283fd5c commit 4977f38

43 files changed

Lines changed: 18 additions & 2107 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎BREAKING_CHANGES.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,12 @@ This is a comprehensive list of the breaking changes introduced in the major ver
1818

1919
#### Legacy Browser Support Fields Removed
2020

21+
##### `__deprecated__cssVarsShim`
22+
23+
`extras.__deprecated__cssVarsShim` causes Stencil to include a polyfill for [CSS
24+
variables](https://developer.mozilla.org/en-US/docs/Web/CSS/--*). For Stencil
25+
v4.0.0 this field and corresponding behavior has been removed.
26+
2127
##### `__deprecated__dynamicImportShim`
2228

2329
The `extras.__deprecated__dynamicImportShim` option causes Stencil to include a polyfill for

‎scripts/bundles/internal-platform-client.ts‎

Lines changed: 2 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import fs from 'fs-extra';
22
import glob from 'glob';
33
import { basename, join } from 'path';
4-
import { rollup, RollupOptions } from 'rollup';
5-
import ts from 'typescript';
4+
import { RollupOptions } from 'rollup';
65

76
import { getBanner } from '../utils/banner';
87
import type { BuildOptions } from '../utils/options';
@@ -85,52 +84,6 @@ export async function internalClient(opts: BuildOptions) {
8584
}
8685
},
8786
},
88-
{
89-
name: 'internalClientRuntimeCssShim',
90-
resolveId(importee) {
91-
if (importee === './polyfills/css-shim.js') {
92-
return importee;
93-
}
94-
return null;
95-
},
96-
97-
async load(id) {
98-
// bundle the css-shim into one file
99-
if (id === './polyfills/css-shim.js') {
100-
const rollupBuild = await rollup({
101-
input: join(inputClientDir, 'polyfills', 'css-shim', 'index.js'),
102-
onwarn: (message) => {
103-
if (/top level of an ES module/.test(message as any)) return;
104-
console.error(message);
105-
},
106-
});
107-
108-
const { output } = await rollupBuild.generate({ format: 'es' });
109-
110-
const { minify } = await import('terser');
111-
112-
const transpileToEs5 = ts.transpileModule(output[0].code, {
113-
compilerOptions: {
114-
target: ts.ScriptTarget.ES5,
115-
},
116-
});
117-
118-
let code = transpileToEs5.outputText;
119-
120-
if (opts.isProd) {
121-
const minifyResults = await minify(code);
122-
code = minifyResults.code;
123-
}
124-
125-
const dest = join(outputInternalClientPolyfillsDir, 'css-shim.js');
126-
await fs.writeFile(dest, code);
127-
128-
return code;
129-
}
130-
return null;
131-
},
132-
},
133-
13487
{
13588
name: 'internalClientRuntimePolyfills',
13689
resolveId(importee) {
@@ -148,18 +101,7 @@ export async function internalClient(opts: BuildOptions) {
148101
],
149102
};
150103

151-
const internalClientPatchEsmBundle = { ...internalClientPatchBrowserBundle };
152-
internalClientPatchEsmBundle.input = join(inputClientDir, 'client-patch-esm.js');
153-
internalClientPatchEsmBundle.output = {
154-
format: 'es',
155-
dir: outputInternalClientDir,
156-
entryFileNames: 'patch-esm.js',
157-
chunkFileNames: '[name].js',
158-
banner: getBanner(opts, 'Stencil Client Patch Esm'),
159-
preferConst: true,
160-
};
161-
162-
return [internalClientBundle, internalClientPatchBrowserBundle, internalClientPatchEsmBundle];
104+
return [internalClientBundle, internalClientPatchBrowserBundle];
163105
}
164106

165107
async function copyPolyfills(opts: BuildOptions, outputInternalClientPolyfillsDir: string) {

‎scripts/test/validate-build.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -316,7 +316,6 @@ async function validateTreeshaking(opts: BuildOptions) {
316316
await validateModuleTreeshake(opts, 'app-data', join(opts.output.internalDir, 'app-data', 'index.js'));
317317
await validateModuleTreeshake(opts, 'client', join(opts.output.internalDir, 'client', 'index.js'));
318318
await validateModuleTreeshake(opts, 'patch-browser', join(opts.output.internalDir, 'client', 'patch-browser.js'));
319-
await validateModuleTreeshake(opts, 'patch-esm', join(opts.output.internalDir, 'client', 'patch-esm.js'));
320319
await validateModuleTreeshake(opts, 'shadow-css', join(opts.output.internalDir, 'client', 'shadow-css.js'));
321320
await validateModuleTreeshake(opts, 'hydrate', join(opts.output.internalDir, 'hydrate', 'index.js'));
322321
await validateModuleTreeshake(opts, 'stencil-core', join(opts.output.internalDir, 'stencil-core', 'index.js'));

‎src/app-data/index.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -72,8 +72,6 @@ export const BUILD: BuildConditionals = {
7272
propBoolean: true,
7373
propNumber: true,
7474
propString: true,
75-
// TODO(STENCIL-659): Remove code implementing the CSS variable shim
76-
cssVarShim: false,
7775
constructableCSS: true,
7876
cmpShouldUpdate: true,
7977
devTools: false,

‎src/client/client-patch-browser.ts‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { BUILD, NAMESPACE } from '@app-data';
2-
import { consoleDevInfo, doc, H, plt, promiseResolve, win } from '@platform';
2+
import { consoleDevInfo, doc, H, promiseResolve } from '@platform';
33

44
import type * as d from '../declarations';
55

@@ -9,13 +9,6 @@ export const patchBrowser = (): Promise<d.CustomElementsDefineOptions> => {
99
consoleDevInfo('Running in development mode.');
1010
}
1111

12-
// TODO(STENCIL-659): Remove code implementing the CSS variable shim
13-
if (BUILD.cssVarShim) {
14-
// shim css vars
15-
// TODO(STENCIL-659): Remove code implementing the CSS variable shim
16-
plt.$cssShim$ = (win as any).__cssshim;
17-
}
18-
1912
if (BUILD.cloneNodeFix) {
2013
// opted-in to polyfill cloneNode() for slot polyfilled components
2114
patchCloneNodeFix((H as any).prototype);

‎src/client/client-patch-esm.ts‎

Lines changed: 0 additions & 21 deletions
This file was deleted.

‎src/client/client-window.ts‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,6 @@ import type * as d from '../declarations';
44

55
export const win = typeof window !== 'undefined' ? window : ({} as Window);
66

7-
// TODO(STENCIL-659): Remove code implementing the CSS variable shim
8-
export const CSS = BUILD.cssVarShim ? (win as any).CSS : null;
9-
107
export const doc = win.document || ({ head: {} } as Document);
118

129
export const H = ((win as any).HTMLElement || (class {} as any)) as HTMLElement;

0 commit comments

Comments
 (0)