From f6fdedfa3cade92e1b9bed643794f89545cd41c9 Mon Sep 17 00:00:00 2001 From: Qihang <88216042+qihach64@users.noreply.github.com> Date: Fri, 26 Jul 2024 08:41:42 -0700 Subject: [PATCH] =?UTF-8?q?LSC=20=E2=80=94=20Explicitly=20mark=20AOT=20inc?= =?UTF-8?q?ompatible=20targets=20via=20'jit:true'=20(#6886)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Motivation for features / changes This PR is for the LSC that will add `jit: true` to all `@Directive`, `@Component` and `@NgModule` classes that are not AOT compatible. Commonly in Google3, TypeScript test files are part of a `ts_library` or a `ng_module w/ testonly=True`. These targets simply run the TypeScript compiler from Microsoft, without any specific Angular processing. This allows code to exist that isn't necessarily compatible with Angular's compiler that strictly checks e.g. components This LSC adds `jit: true` to those components to clearly indicate that those components are not processed by the Angular compiler. This is a no-op because the Angular compiler doesn't even run on these files (as said above). In the future, we would like to change this, and need clear indication of what is incompatible or not. This is what the `jit: true` flag does. The `jit: true` flag basically tells the Angular compiler to ignore these components, so that their behavior is unchanged and everything continues to work like before. --- .../webapp/app_routing/effects/app_routing_effects_test.ts | 2 +- .../views/feature_flag_modal_trigger_container_test.ts | 1 + tensorboard/webapp/plugins/testing/index.ts | 1 + tensorboard/webapp/testing/integration_test_module.ts | 1 + .../webapp/webapp_data_source/tb_feature_flag_testing.ts | 1 + .../webapp/webapp_data_source/tb_http_client_testing.ts | 1 + .../intersection_observer_testing_module.ts | 3 ++- tensorboard/webapp/widgets/resize_detector_testing_module.ts | 1 + 8 files changed, 9 insertions(+), 2 deletions(-) diff --git a/tensorboard/webapp/app_routing/effects/app_routing_effects_test.ts b/tensorboard/webapp/app_routing/effects/app_routing_effects_test.ts index 2bc28b2fe5..10543e6db2 100644 --- a/tensorboard/webapp/app_routing/effects/app_routing_effects_test.ts +++ b/tensorboard/webapp/app_routing/effects/app_routing_effects_test.ts @@ -48,7 +48,7 @@ import { } from '../types'; import {AppRoutingEffects, TEST_ONLY} from './app_routing_effects'; -@Component({selector: 'test', template: ''}) +@Component({selector: 'test', template: '', jit: true}) class TestableComponent {} const testAction = createAction('[TEST] test action'); diff --git a/tensorboard/webapp/feature_flag/views/feature_flag_modal_trigger_container_test.ts b/tensorboard/webapp/feature_flag/views/feature_flag_modal_trigger_container_test.ts index 5bb82fde76..232a223a0e 100644 --- a/tensorboard/webapp/feature_flag/views/feature_flag_modal_trigger_container_test.ts +++ b/tensorboard/webapp/feature_flag/views/feature_flag_modal_trigger_container_test.ts @@ -37,6 +37,7 @@ import { @Component({ selector: 'testable-feature-flag-dialog-container', template: '
Test
', + jit: true, }) class TestableFeatureFlagDialogContainer {} diff --git a/tensorboard/webapp/plugins/testing/index.ts b/tensorboard/webapp/plugins/testing/index.ts index e33b7edd3d..6dc92e29bb 100644 --- a/tensorboard/webapp/plugins/testing/index.ts +++ b/tensorboard/webapp/plugins/testing/index.ts @@ -26,5 +26,6 @@ export class ExtraDashboardComponent {} imports: [ PluginRegistryModule.forPlugin('extra-plugin', ExtraDashboardComponent), ], + jit: true, }) export class ExtraDashboardModule {} diff --git a/tensorboard/webapp/testing/integration_test_module.ts b/tensorboard/webapp/testing/integration_test_module.ts index b60e0c5dca..d67da7e0bb 100644 --- a/tensorboard/webapp/testing/integration_test_module.ts +++ b/tensorboard/webapp/testing/integration_test_module.ts @@ -62,5 +62,6 @@ export function provideRoute(): RouteDef[] { ], declarations: [TestableComponent], exports: [TestableComponent], + jit: true, }) export class IntegrationTestSetupModule {} diff --git a/tensorboard/webapp/webapp_data_source/tb_feature_flag_testing.ts b/tensorboard/webapp/webapp_data_source/tb_feature_flag_testing.ts index f19879e7b1..bb04dddc4f 100644 --- a/tensorboard/webapp/webapp_data_source/tb_feature_flag_testing.ts +++ b/tensorboard/webapp/webapp_data_source/tb_feature_flag_testing.ts @@ -42,5 +42,6 @@ export class TestingTBFeatureFlagDataSource extends TBFeatureFlagDataSource { useExisting: TestingTBFeatureFlagDataSource, }, ], + jit: true, }) export class TBFeatureFlagTestingModule {} diff --git a/tensorboard/webapp/webapp_data_source/tb_http_client_testing.ts b/tensorboard/webapp/webapp_data_source/tb_http_client_testing.ts index 0a9aa4898f..22c7ffcdb9 100644 --- a/tensorboard/webapp/webapp_data_source/tb_http_client_testing.ts +++ b/tensorboard/webapp/webapp_data_source/tb_http_client_testing.ts @@ -34,5 +34,6 @@ import {TBHttpClientModule} from './tb_http_client_module'; ), }), ], + jit: true, }) export class TBHttpClientTestingModule {} diff --git a/tensorboard/webapp/widgets/intersection_observer/intersection_observer_testing_module.ts b/tensorboard/webapp/widgets/intersection_observer/intersection_observer_testing_module.ts index 2000366e22..6c48c4b48e 100644 --- a/tensorboard/webapp/widgets/intersection_observer/intersection_observer_testing_module.ts +++ b/tensorboard/webapp/widgets/intersection_observer/intersection_observer_testing_module.ts @@ -16,7 +16,7 @@ import {Directive, EventEmitter, NgModule, Output} from '@angular/core'; import {ComponentFixture} from '@angular/core/testing'; import {By} from '@angular/platform-browser'; -@Directive({selector: '[observeIntersection]'}) +@Directive({selector: '[observeIntersection]', jit: true}) class IntersectionObserverTestingDirective { @Output() onVisibilityChange = new EventEmitter<{visible: boolean}>(); @@ -28,6 +28,7 @@ class IntersectionObserverTestingDirective { @NgModule({ exports: [IntersectionObserverTestingDirective], declarations: [IntersectionObserverTestingDirective], + jit: true, }) export class IntersectionObserverTestingModule { simulateVisibilityChange(fixture: ComponentFixture, visible: boolean) { diff --git a/tensorboard/webapp/widgets/resize_detector_testing_module.ts b/tensorboard/webapp/widgets/resize_detector_testing_module.ts index 7a81c7e9e9..01c3f20d8c 100644 --- a/tensorboard/webapp/widgets/resize_detector_testing_module.ts +++ b/tensorboard/webapp/widgets/resize_detector_testing_module.ts @@ -29,6 +29,7 @@ class ResizeDetectorTestingDirective { @NgModule({ exports: [ResizeDetectorTestingDirective], declarations: [ResizeDetectorTestingDirective], + jit: true, }) export class ResizeDetectorTestingModule { simulateResize(fixture: ComponentFixture) {