refactor: node native esm

.eslintrc

@@ -110,5 +110,8 @@
         "browser": true,
         "node": true,
         "jasmine": true
+    },
+    "parserOptions": {
+        "ecmaVersion": 2020
     }
 }

.github/workflows/ci_main.yml

@@ -35,10 +35,6 @@ jobs:
       run: npm run dtslint
     - name: api_guardian
       run: npm run api_guardian
-    - name: import
-      if: ${{ matrix.node == '14' }}
-      run: npm run test:import
     - name: import
       if: ${{ matrix.node == '14' || matrix.node == '15' }}
-      run: npm run test:esm
-
+      run: npm run test:import

.gitignore

@@ -20,6 +20,7 @@ spec-js/
 spec-build/
 .out/
 .tmp/
+.eslintcache
 
 # Import location artifacts
 /ajax/
@@ -35,6 +36,7 @@ npm-debug.log
 
 integration/import/**/rx.json
 integration/import/**/operators.json
+integration/import/**/*.txt
 
 # The check-side-effects package generates and deletes this file.
 # If the process is killed, it will be left behind.

api_guard/dist/types/operators/index.d.ts

@@ -286,7 +286,7 @@ export declare function tap<T>(next?: ((value: T) => void) | null, error?: ((err
 
 export declare function throttle<T>(durationSelector: (value: T) => ObservableInput<any>, { leading, trailing }?: ThrottleConfig): MonoTypeOperatorFunction<T>;
 
-export declare function throttleTime<T>(duration: number, scheduler?: SchedulerLike, config?: import("./throttle").ThrottleConfig): MonoTypeOperatorFunction<T>;
+export declare function throttleTime<T>(duration: number, scheduler?: SchedulerLike, config?: import("./throttle.js").ThrottleConfig): MonoTypeOperatorFunction<T>;
 
 export declare function throwIfEmpty<T>(errorFactory?: () => any): MonoTypeOperatorFunction<T>;
 

docs_app/src/app/app.component.spec.ts

@@ -10,8 +10,8 @@ import { By } from '@angular/platform-browser';
 import { of, timer } from 'rxjs';
 import { first, mapTo } from 'rxjs/operators';
 
-import { AppComponent } from './app.component';
-import { AppModule } from './app.module';
+import { AppComponent } from './app.component.js';
+import { AppModule } from './app.module.js';
 import { DocumentService } from 'app/documents/document.service';
 import { DocViewerComponent } from 'app/layout/doc-viewer/doc-viewer.component';
 import { Deployment } from 'app/shared/deployment.service';
@@ -28,7 +28,7 @@ import { SearchResultsComponent } from 'app/shared/search-results/search-results
 import { SearchService } from 'app/search/search.service';
 import { SelectComponent } from 'app/shared/select/select.component';
 import { TocItem, TocService } from 'app/shared/toc.service';
-import { ElementsLoader } from './custom-elements/elements-loader';
+import { ElementsLoader } from './custom-elements/elements-loader.js';
 
 const sideBySideBreakPoint = 992;
 const hideToCBreakPoint = 800;

docs_app/src/app/app.module.ts

@@ -41,7 +41,7 @@ import { CustomElementsModule } from 'app/custom-elements/custom-elements.module
 import { SharedModule } from 'app/shared/shared.module';
 import { SwUpdatesModule } from 'app/sw-updates/sw-updates.module';
 
-import {environment} from '../environments/environment';
+import {environment} from '../environments/environment.js';
 
 // These are the hardcoded inline svg sources to be used by the `<mat-icon>` component.
 // tslint:disable: max-line-length

docs_app/src/app/custom-elements/announcement-bar/announcement-bar.component.spec.ts

@@ -2,7 +2,7 @@ import { HttpClientTestingModule, HttpTestingController } from '@angular/common/
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { Logger } from 'app/shared/logger.service';
 import { MockLogger } from 'testing/logger.service';
-import { AnnouncementBarComponent } from './announcement-bar.component';
+import { AnnouncementBarComponent } from './announcement-bar.component.js';
 
 const today = new Date();
 const lastWeek = changeDays(today, -7);

docs_app/src/app/custom-elements/announcement-bar/announcement-bar.module.ts

@@ -1,9 +1,9 @@
 import { NgModule, Type } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { HttpClientModule } from '@angular/common/http';
-import { SharedModule } from '../../shared/shared.module';
-import { AnnouncementBarComponent } from './announcement-bar.component';
-import { WithCustomElementComponent } from '../element-registry';
+import { SharedModule } from '../../shared/shared.module.js';
+import { AnnouncementBarComponent } from './announcement-bar.component.js';
+import { WithCustomElementComponent } from '../element-registry.js';
 
 @NgModule({
   imports: [ CommonModule, SharedModule, HttpClientModule ],

docs_app/src/app/custom-elements/api/api-list.component.spec.ts

@@ -1,12 +1,12 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { BehaviorSubject } from 'rxjs';
 
-import { ApiListComponent } from './api-list.component';
-import { ApiItem, ApiSection, ApiService } from './api.service';
+import { ApiListComponent } from './api-list.component.js';
+import { ApiItem, ApiSection, ApiService } from './api.service.js';
 import { LocationService } from 'app/shared/location.service';
 import { Logger } from 'app/shared/logger.service';
 import { MockLogger } from 'testing/logger.service';
-import { ApiListModule } from './api-list.module';
+import { ApiListModule } from './api-list.module.js';
 
 describe('ApiListComponent', () => {
   let component: ApiListComponent;

docs_app/src/app/custom-elements/api/api-list.component.ts

@@ -11,7 +11,7 @@ import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
 import { combineLatest, Observable, ReplaySubject } from 'rxjs';
 
 import { LocationService } from 'app/shared/location.service';
-import { ApiSection, ApiService } from './api.service';
+import { ApiSection, ApiService } from './api.service.js';
 
 import { Option } from 'app/shared/select/select.component';
 import { map } from 'rxjs/operators';

docs_app/src/app/custom-elements/api/api-list.module.ts

@@ -1,10 +1,10 @@
 import { NgModule, Type } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { HttpClientModule } from '@angular/common/http';
-import { SharedModule } from '../../shared/shared.module';
-import { ApiListComponent } from './api-list.component';
-import { ApiService } from './api.service';
-import { WithCustomElementComponent } from '../element-registry';
+import { SharedModule } from '../../shared/shared.module.js';
+import { ApiListComponent } from './api-list.component.js';
+import { ApiService } from './api.service.js';
+import { WithCustomElementComponent } from '../element-registry.js';
 
 @NgModule({
   imports: [ CommonModule, SharedModule, HttpClientModule ],

docs_app/src/app/custom-elements/api/api.service.spec.ts

@@ -4,7 +4,7 @@ import { TestBed } from '@angular/core/testing';
 
 import { Logger } from 'app/shared/logger.service';
 
-import { ApiService } from './api.service';
+import { ApiService } from './api.service.js';
 
 describe('ApiService', () => {
 

docs_app/src/app/custom-elements/code/code-example.component.spec.ts

@@ -1,8 +1,8 @@
 import { Component, ViewChild } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { CodeExampleComponent } from './code-example.component';
-import { CodeExampleModule } from './code-example.module';
+import { CodeExampleComponent } from './code-example.component.js';
+import { CodeExampleModule } from './code-example.module.js';
 import { Logger } from 'app/shared/logger.service';
 import { MockLogger } from 'testing/logger.service';
 

docs_app/src/app/custom-elements/code/code-example.component.ts

@@ -1,6 +1,6 @@
 /* tslint:disable component-selector */
 import { Component, HostBinding, ElementRef, ViewChild, Input, AfterViewInit } from '@angular/core';
-import { CodeComponent } from './code.component';
+import { CodeComponent } from './code.component.js';
 
 /**
  * An embeddable code block that displays nicely formatted code.

docs_app/src/app/custom-elements/code/code-example.module.ts

@@ -1,8 +1,8 @@
 import { NgModule, Type } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { CodeExampleComponent } from './code-example.component';
-import { CodeModule } from './code.module';
-import { WithCustomElementComponent } from '../element-registry';
+import { CodeExampleComponent } from './code-example.component.js';
+import { CodeModule } from './code.module.js';
+import { WithCustomElementComponent } from '../element-registry.js';
 
 @NgModule({
   imports: [ CommonModule, CodeModule ],

docs_app/src/app/custom-elements/code/code-tabs.component.spec.ts

@@ -4,8 +4,8 @@ import { Logger } from 'app/shared/logger.service';
 import { MockLogger } from 'testing/logger.service';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 
-import { CodeTabsComponent } from './code-tabs.component';
-import { CodeTabsModule } from './code-tabs.module';
+import { CodeTabsComponent } from './code-tabs.component.js';
+import { CodeTabsModule } from './code-tabs.module.js';
 
 describe('CodeTabsComponent', () => {
   let fixture: ComponentFixture<HostComponent>;

docs_app/src/app/custom-elements/code/code-tabs.component.ts

@@ -1,6 +1,6 @@
 /* tslint:disable component-selector */
 import { AfterViewInit, Component, ElementRef, Input, OnInit, QueryList, ViewChild, ViewChildren } from '@angular/core';
-import { CodeComponent } from './code.component';
+import { CodeComponent } from './code.component.js';
 
 export interface TabInfo {
   class: string|null;

docs_app/src/app/custom-elements/code/code-tabs.module.ts

@@ -1,10 +1,10 @@
 import { NgModule, Type } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { CodeTabsComponent } from './code-tabs.component';
+import { CodeTabsComponent } from './code-tabs.component.js';
 import { MatCardModule } from '@angular/material/card';
 import { MatTabsModule } from '@angular/material/tabs';
-import { CodeModule } from './code.module';
-import { WithCustomElementComponent } from '../element-registry';
+import { CodeModule } from './code.module.js';
+import { WithCustomElementComponent } from '../element-registry.js';
 
 @NgModule({
   imports: [ CommonModule, MatCardModule, MatTabsModule, CodeModule ],

docs_app/src/app/custom-elements/code/code.component.spec.ts

@@ -4,8 +4,8 @@ import { Logger } from 'app/shared/logger.service';
 import { MockLogger } from 'testing/logger.service';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 
-import { CodeTabsComponent } from './code-tabs.component';
-import { CodeTabsModule } from './code-tabs.module';
+import { CodeTabsComponent } from './code-tabs.component.js';
+import { CodeTabsModule } from './code-tabs.module.js';
 
 describe('CodeTabsComponent', () => {
   let fixture: ComponentFixture<HostComponent>;

docs_app/src/app/custom-elements/code/code.component.ts

@@ -1,11 +1,11 @@
 import { Component, ElementRef, EventEmitter, Input, OnChanges, Output, ViewChild } from '@angular/core';
 import { Logger } from 'app/shared/logger.service';
-import { PrettyPrinter } from './pretty-printer.service';
+import { PrettyPrinter } from './pretty-printer.service.js';
 import { CopierService } from 'app/shared/copier.service';
 import { MatSnackBar } from '@angular/material/snack-bar';
 import { tap } from 'rxjs/operators';
 import { StackblitzService } from 'app/shared/stackblitz.service';
-import version from '../../../../tools/stackblitz/rxjs.version';
+import version from '../../../../tools/stackblitz/rxjs.version.js';
 
 /**
  * If linenums is not set, this is the default maximum number of lines that

docs_app/src/app/custom-elements/code/code.module.ts

@@ -1,8 +1,8 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { CodeComponent } from './code.component';
+import { CodeComponent } from './code.component.js';
 import { MatSnackBarModule } from '@angular/material/snack-bar';
-import { PrettyPrinter } from './pretty-printer.service';
+import { PrettyPrinter } from './pretty-printer.service.js';
 import { CopierService } from 'app/shared/copier.service';
 
 @NgModule({

docs_app/src/app/custom-elements/contributor/contributor-list.component.spec.ts

@@ -2,9 +2,9 @@ import { ReflectiveInjector } from '@angular/core';
 
 import { of } from 'rxjs';
 
-import { ContributorGroup } from './contributors.model';
-import { ContributorListComponent } from './contributor-list.component';
-import { ContributorService } from './contributor.service';
+import { ContributorGroup } from './contributors.model.js';
+import { ContributorListComponent } from './contributor-list.component.js';
+import { ContributorService } from './contributor.service.js';
 import { LocationService } from 'app/shared/location.service';
 
 // Testing the component class behaviors, independent of its template

docs_app/src/app/custom-elements/contributor/contributor-list.component.ts

@@ -1,6 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { ContributorGroup } from './contributors.model';
-import { ContributorService } from './contributor.service';
+import { ContributorGroup } from './contributors.model.js';
+import { ContributorService } from './contributor.service.js';
 import { LocationService } from 'app/shared/location.service';
 
 @Component({

docs_app/src/app/custom-elements/contributor/contributor-list.module.ts

@@ -1,9 +1,9 @@
 import { NgModule, Type } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { ContributorListComponent } from './contributor-list.component';
-import { ContributorService } from './contributor.service';
-import { ContributorComponent } from './contributor.component';
-import { WithCustomElementComponent } from '../element-registry';
+import { ContributorListComponent } from './contributor-list.component.js';
+import { ContributorService } from './contributor.service.js';
+import { ContributorComponent } from './contributor.component.js';
+import { WithCustomElementComponent } from '../element-registry.js';
 
 @NgModule({
   imports: [CommonModule],

docs_app/src/app/custom-elements/contributor/contributor.component.ts

@@ -1,6 +1,6 @@
 import { Component, Input } from '@angular/core';
 
-import { Contributor } from './contributors.model';
+import { Contributor } from './contributors.model.js';
 import { CONTENT_URL_PREFIX } from 'app/documents/document.service';
 
 @Component({

docs_app/src/app/custom-elements/contributor/contributor.service.spec.ts

@@ -2,8 +2,8 @@ import { HttpClientTestingModule, HttpTestingController } from '@angular/common/
 import { Injector } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
 
-import { ContributorService } from './contributor.service';
-import { ContributorGroup } from './contributors.model';
+import { ContributorService } from './contributor.service.js';
+import { ContributorGroup } from './contributors.model.js';
 
 describe('ContributorService', () => {
 

docs_app/src/app/custom-elements/contributor/contributor.service.ts

@@ -4,7 +4,7 @@ import { HttpClient } from '@angular/common/http';
 import { ConnectableObservable, Observable } from 'rxjs';
 import { map, publishLast } from 'rxjs/operators';
 
-import { Contributor, ContributorGroup } from './contributors.model';
+import { Contributor, ContributorGroup } from './contributors.model.js';
 
 // TODO(andrewjs): Look into changing this so that we don't import the service just to get the const
 import { CONTENT_URL_PREFIX } from 'app/documents/document.service';

docs_app/src/app/custom-elements/current-location/current-location.component.spec.ts

@@ -1,7 +1,7 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { LocationService } from 'app/shared/location.service';
 import { MockLocationService } from 'testing/location.service';
-import { CurrentLocationComponent } from './current-location.component';
+import { CurrentLocationComponent } from './current-location.component.js';
 
 
 describe('CurrentLocationComponent', () => {

docs_app/src/app/custom-elements/current-location/current-location.module.ts

@@ -1,7 +1,7 @@
 import { NgModule, Type } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { CurrentLocationComponent } from './current-location.component';
-import { WithCustomElementComponent } from '../element-registry';
+import { CurrentLocationComponent } from './current-location.component.js';
+import { WithCustomElementComponent } from '../element-registry.js';
 
 @NgModule({
   imports: [ CommonModule ],

docs_app/src/app/custom-elements/custom-elements.module.ts

@@ -1,12 +1,12 @@
 import { NgModule } from '@angular/core';
 import { ROUTES} from '@angular/router';
-import { ElementsLoader } from './elements-loader';
+import { ElementsLoader } from './elements-loader.js';
 import {
   ELEMENT_MODULE_LOAD_CALLBACKS,
   ELEMENT_MODULE_LOAD_CALLBACKS_AS_ROUTES,
   ELEMENT_MODULE_LOAD_CALLBACKS_TOKEN
-} from './element-registry';
-import { LazyCustomElementComponent } from './lazy-custom-element.component';
+} from './element-registry.js';
+import { LazyCustomElementComponent } from './lazy-custom-element.component.js';
 
 @NgModule({
   declarations: [ LazyCustomElementComponent ],

docs_app/src/app/custom-elements/elements-loader.spec.ts

@@ -7,8 +7,8 @@ import {
 } from '@angular/core';
 import { TestBed, fakeAsync, flushMicrotasks } from '@angular/core/testing';
 
-import { ElementsLoader } from './elements-loader';
-import { ELEMENT_MODULE_LOAD_CALLBACKS_TOKEN, WithCustomElementComponent } from './element-registry';
+import { ElementsLoader } from './elements-loader.js';
+import { ELEMENT_MODULE_LOAD_CALLBACKS_TOKEN, WithCustomElementComponent } from './element-registry.js';
 
 
 interface Deferred {