Elgato_dark/angular
1
0
Fork 0
mirror of https://github.com/angular/angular synced 2026-05-24 09:28:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

test(core): add symbol tracking for @defer feature (#52065)

Browse source 
This commit adds a bundling test, which also includes symbol tracking for `@defer` feature.

PR Close #52065
This commit is contained in:
Andrew Kushnir 2023-10-05 18:45:09 -07:00 committed by Andrew Scott
parent db3a90191f
commit b88cc9eccb
6 changed files with 2595 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

67
packages/core/test/bundling/defer/BUILD.bazel Normal file
View file

@ -0,0 +1,67 @@
load("//tools:defaults.bzl", "app_bundle", "jasmine_node_test", "ng_module", "ts_library")
load("//tools/symbol-extractor:index.bzl", "js_expected_symbol_test")
load("@npm//http-server:index.bzl", "http_server")
package(default_visibility = ["//visibility:public"])
ng_module(
name = "defer",
srcs = [
"defer.component.ts",
"index.ts",
],
deps = [
"//packages/core",
"//packages/platform-browser",
],
)
app_bundle(
name = "bundle",
entry_point = ":index.ts",
deps = [
":defer",
"//packages/core",
"//packages/platform-browser",
"@npm//rxjs",
],
)
ts_library(
name = "test_lib",
testonly = True,
srcs = glob(["*_spec.ts"]),
deps = [
"//packages:types",
"//packages/compiler",
"//packages/core/testing",
"//packages/private/testing",
"@npm//@bazel/runfiles",
],
)
jasmine_node_test(
name = "test",
data = [
":bundle.debug.min.js",
":bundle.js",
":bundle.min.js",
":bundle.min.js.br",
],
deps = [":test_lib"],
)
js_expected_symbol_test(
name = "symbol_test",
src = ":bundle.debug.min.js",
golden = ":bundle.golden_symbols.json",
)
http_server(
name = "devserver",
data = [
"index.html",
":bundle.debug.min.js",
":bundle.min.js",
],
)

2408
packages/core/test/bundling/defer/bundle.golden_symbols.json Normal file
View file

File diff suppressed because it is too large Load diff

19
packages/core/test/bundling/defer/defer.component.ts Normal file
View file

@ -0,0 +1,19 @@
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {Component} from '@angular/core';
@Component({
standalone: true,
selector: 'defer-cmp',
template: `
<h2>Defer-loaded component</h2>
`,
})
export class DeferComponent {
}

31
packages/core/test/bundling/defer/index.html Normal file
View file

@ -0,0 +1,31 @@
<!doctype html>
<html>
<head>
<title>Defer Example</title>
</head>
<body>
<!-- The Angular application will be bootstrapped into this element. -->
<app-root></app-root>
<!--
Script tag which bootstraps the application. Use `?debug` in URL to select
the debug version of the script.
There are two scripts sources: `bundle.min.js` and `bundle.debug.min.js` You can
switch between which bundle the browser loads to experiment with the application.
- `bundle.min.js`: Is what the site would serve to their users. It has gone
through rollup, build-optimizer, and uglify with tree shaking.
- `bundle.debug.min.js`: Is what the developer would like to see when debugging
the application. It has also gone through full pipeline of esbuild, babel optimization,
plugins from the devkit and terser, however mangling is disabled and the minified
file is formatted using prettier (to ease debugging).
-->
<script>
document.write('<script src="' +
(document.location.search.endsWith('debug') ? '/bundle.debug.min.js' : '/bundle.min.js') +
'"></' + 'script>');
</script>
</body>
</html>

36
packages/core/test/bundling/defer/index.ts Normal file
View file

@ -0,0 +1,36 @@
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {Component} from '@angular/core';
import {bootstrapApplication} from '@angular/platform-browser';
import {DeferComponent} from './defer.component';
@Component({
standalone: true,
selector: 'app-root',
imports: [DeferComponent],
template: `
<h1>Defer feature</h1>
@defer (when isVisible) {
<defer-cmp />
} @loading {
loading
} @placeholder {
Placeholder
} @error {
Error
}
`,
})
export class AppComponent {
isVisible = true;
}
bootstrapApplication(AppComponent);

34
packages/core/test/bundling/defer/treeshaking_spec.ts Normal file
View file

@ -0,0 +1,34 @@
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import '@angular/compiler';
import {runfiles} from '@bazel/runfiles';
import * as fs from 'fs';
import * as path from 'path';
const PACKAGE = 'angular/packages/core/test/bundling/defer';
describe('treeshaking with uglify', () => {
let content: string;
// We use the debug version as otherwise symbols/identifiers would be mangled (and the test would
// always pass)
const contentPath = runfiles.resolve(path.join(PACKAGE, 'bundle.debug.min.js'));
beforeAll(() => {
content = fs.readFileSync(contentPath, {encoding: 'utf-8'});
});
it('should drop unused TypeScript helpers', () => {
expect(content).not.toContain('__asyncGenerator');
});
it('should not contain rxjs from commonjs distro', () => {
expect(content).not.toContain('commonjsGlobal');
expect(content).not.toContain('createCommonjsModule');
});
});