feat(mock-doc): add NodeList (#1614)

src/mock-doc/global.ts

@@ -93,5 +93,6 @@ const WINDOW_PROPS = [
   'Event',
   'Element',
   'HTMLElement',
+  'NodeList',
   'KeyboardEvent'
 ];

src/mock-doc/node.ts

@@ -163,6 +163,18 @@ export class MockNode {
 }
 
 
+export class MockNodeList {
+  childNodes: MockNode[];
+  length: number;
+  ownerDocument: any;
+
+  constructor(ownerDocument: any, childNodes: MockNode[], length: number) {
+    this.ownerDocument = ownerDocument;
+    this.childNodes = childNodes;
+    this.length = length;
+  }
+}
+
 const attrsMap = new WeakMap<MockElement, MockAttributeMap>();
 const shadowRootMap = new WeakMap<MockElement, ShadowRoot>();
 const stylesMap = new WeakMap<MockElement, CSSStyleDeclaration>();

src/mock-doc/window.ts

@@ -2,7 +2,7 @@ import { createConsole } from './console';
 import { MockCustomElementRegistry, resetCustomElementRegistry } from './custom-element-registry';
 import { MockCustomEvent, MockEvent, MockKeyboardEvent, addEventListener, dispatchEvent, removeEventListener, resetEventListeners } from './event';
 import { MockDocument, resetDocument } from './document';
-import { MockElement, MockHTMLElement } from './node';
+import { MockElement, MockHTMLElement, MockNodeList} from './node';
 import { MockHistory } from './history';
 import { MockLocation } from './location';
 import { MockNavigator } from './navigator';
@@ -14,6 +14,7 @@ import { URL } from 'url';
 const historyMap = new WeakMap<MockWindow, MockHistory>();
 const elementCstrMap = new WeakMap<MockWindow, any>();
 const htmlElementCstrMap = new WeakMap<MockWindow, any>();
+const nodeListCstrMap = new WeakMap<MockWindow, any>();
 const localStorageMap = new WeakMap<MockWindow, MockStorage>();
 const locMap = new WeakMap<MockWindow, MockLocation>();
 const navMap = new WeakMap<MockWindow, MockNavigator>();
@@ -200,6 +201,20 @@ export class MockWindow {
     return ElementCstr;
   }
 
+  get NodeList() {
+    let NodeListCstr = nodeListCstrMap.get(this);
+    if (NodeListCstr == null) {
+      const ownerDocument = this.document;
+      NodeListCstr = class extends MockNodeList {
+        constructor() {
+          super(ownerDocument, [], 0);
+          throw (new Error('Illegal constructor: cannot constructor'))
+        }
+      };
+      return NodeListCstr;
+    }
+  }
+
   get HTMLElement() {
     let HtmlElementCstr = htmlElementCstrMap.get(this);
     if (HtmlElementCstr == null) {
@@ -442,6 +457,7 @@ export function resetWindow(win: Window) {
     historyMap.delete(win as any);
     htmlElementCstrMap.delete(win as any);
     elementCstrMap.delete(win as any);
+    nodeListCstrMap.delete(win as any);
     localStorageMap.delete(win as any);
     locMap.delete(win as any);
     navMap.delete(win as any);

src/runtime/test/globals.spec.tsx

@@ -33,26 +33,40 @@ describe('globals', () => {
     expect((window as any).JSON.stringify([0])).toEqual('[0]');
   });
 
-  it('allows access to the Element prototype', async () => {
-    @Component({ tag: 'cmp-el' })
-    class CmpEl {
-      // @ts-ignore
-      private proto: any;
-
-      constructor() {
-        this.proto = Element.prototype;
+  describe('globals/prototypes', () => {
+    let page;
+    beforeEach(async () => {
+      @Component({ tag: 'cmp-el' })
+      class CmpEl {
+        // @ts-ignore
+        private protoEl: any;
+        private protoNodeList: any;
+
+        constructor() {
+          this.protoEl = Element.prototype;
+          this.protoNodeList = NodeList.prototype;
+        }
       }
-    }
 
-    const page = await newSpecPage({
-      components: [CmpEl],
-      html: `<cmp-el></cmp-el>`
+      page = await newSpecPage({
+        components: [CmpEl],
+        html: `<cmp-el></cmp-el>`
+      });
+    })
+    it('allows access to the NodeList prototype', async () => {
+      expect(page.rootInstance.protoNodeList).toEqual(NodeList.prototype);
+      expect(page.rootInstance.protoNodeList).toEqual((page.win as any).NodeList.prototype);
+      expect(page.rootInstance.protoNodeList).toEqual((window as any).NodeList.prototype);
+      expect(page.rootInstance.protoNodeList).toEqual((global as any).NodeList.prototype);
+      expect(page.rootInstance.protoNodeList).toBeTruthy();
+    });
+
+    it('allows access to the Element prototype', async () => {
+      expect(page.rootInstance.protoEl).toEqual(Element.prototype);
+      expect(page.rootInstance.protoEl).toEqual((page.win as any).Element.prototype);
+      expect(page.rootInstance.protoEl).toEqual((window as any).Element.prototype);
+      expect(page.rootInstance.protoEl).toEqual((global as any).Element.prototype);
+      expect(page.rootInstance.protoEl).toBeTruthy();
     });
-
-    expect(page.rootInstance.proto).toEqual(Element.prototype);
-    expect(page.rootInstance.proto).toEqual((page.win as any).Element.prototype);
-    expect(page.rootInstance.proto).toEqual((window as any).Element.prototype);
-    expect(page.rootInstance.proto).toEqual((global as any).Element.prototype);
-    expect(page.rootInstance.proto).toBeTruthy();
   });
 });