[Flow] Replace nonexistent global ClientRect class with an alias to D…

…OMRect (#9258)

Summary:
Pull Request resolved: #9258

Changelog: [fix] Replace incorrect definition for `ClientRect` and `ClientRectList` with aliases to `DOMRect` and `DOMRectList`

This fixes the type definitions for the DOM APIs in Flow, but replacing an nonexistent globals `ClientRect` and `ClientRectList` types with just an alias to `DOMRect` and `DOMRectList`.

Reviewed By: huntie

Differential Revision: D70083998

fbshipit-source-id: 4f028aea306bd9a6affb05e279e1068bf85bb60b

lib/dom.js

@@ -1711,7 +1711,7 @@ declare class Range { // extension
   setStartBefore(refNode: Node): void;
   selectNode(refNode: Node): void;
   detach(): void;
-  getBoundingClientRect(): ClientRect;
+  getBoundingClientRect(): DOMRect;
   toString(): string;
   compareBoundaryPoints(how: number, sourceRange: Range): number;
   insertNode(newNode: Node): void;
@@ -1720,7 +1720,7 @@ declare class Range { // extension
   cloneContents(): DocumentFragment;
   setEnd(refNode: Node, offset: number): void;
   cloneRange(): Range;
-  getClientRects(): ClientRectList;
+  getClientRects(): DOMRectList;
   surroundContents(newParent: Node): void;
   deleteContents(): void;
   setStartAfter(refNode: Node): void;
@@ -1800,8 +1800,8 @@ declare class Element extends Node implements Animatable {
   getAttributeNS(namespaceURI: string | null, localName: string): string | null;
   getAttributeNode(name: string): Attr | null;
   getAttributeNodeNS(namespaceURI: string | null, localName: string): Attr | null;
-  getBoundingClientRect(): ClientRect;
-  getClientRects(): ClientRect[];
+  getBoundingClientRect(): DOMRect;
+  getClientRects(): DOMRectList;
   getElementsByClassName(names: string): HTMLCollection<HTMLElement>;
   getElementsByTagName(name: 'a'): HTMLCollection<HTMLAnchorElement>;
   getElementsByTagName(name: 'audio'): HTMLCollection<HTMLAudioElement>;
@@ -2093,7 +2093,7 @@ declare class HTMLElement extends Element {
   blur(): void;
   click(): void;
   focus(options?: FocusOptions): void;
-  getBoundingClientRect(): ClientRect;
+  getBoundingClientRect(): DOMRect;
   forceSpellcheck(): void;
   accessKey: string;
   accessKeyLabel: string;
@@ -4235,7 +4235,7 @@ declare class TextRange {
   scrollIntoView(fStart?: boolean): void;
   findText(string: string, count?: number, flags?: number): boolean;
   execCommand(cmdID: string, showUI?: boolean, value?: any): boolean;
-  getBoundingClientRect(): ClientRect | DOMRect;
+  getBoundingClientRect(): DOMRect;
   moveToBookmark(bookmark: string): boolean;
   isEqual(range: TextRange): boolean;
   duplicate(): TextRange;
@@ -4245,7 +4245,7 @@ declare class TextRange {
   pasteHTML(html: string): void;
   inRange(range: TextRange): boolean;
   moveEnd(unit: string, count?: number): number;
-  getClientRects(): ClientRectList | DOMRectList;
+  getClientRects(): DOMRectList;
   moveStart(unit: string, count?: number): number;
   parentElement(): Element;
   queryCommandState(cmdID: string): boolean;
@@ -4258,23 +4258,11 @@ declare class TextRange {
   queryCommandEnabled(cmdID: string): boolean;
 }
 
-declare class ClientRect { // extension
-  left: number;
-  x: number;
-  width: number;
-  right: number;
-  top: number;
-  y: number;
-  bottom: number;
-  height: number;
-}
-
-declare class ClientRectList { // extension
-  @@iterator(): Iterator<ClientRect>;
-  length: number;
-  item(index: number): ClientRect;
-  [index: number]: ClientRect;
-}
+// These types used to exist as a copy of DOMRect/DOMRectList, which is
+// incorrect because there are no ClientRect/ClientRectList globals on the DOM.
+// Keep these as type aliases for backwards compatibility.
+declare type ClientRect = DOMRect;
+declare type ClientRectList = DOMRectList;
 
 // TODO: HTML*Element
 

tests/autocomplete_from_m_to_q/autocomplete_from_m_to_q.exp

@@ -392,8 +392,6 @@ Flags: --pretty
     {"name":"clearInterval","type":"(intervalId: ?IntervalID) => void"},
     {"name":"clearTimeout","type":"(timeoutId: ?TimeoutID) => void"},
     {"name":"Client","type":"typeof Client"},
-    {"name":"ClientRect","type":"typeof ClientRect"},
-    {"name":"ClientRectList","type":"typeof ClientRectList"},
     {"name":"Clients","type":"typeof Clients"},
     {"name":"clients","type":"Clients"},
     {"name":"Clipboard","type":"typeof Clipboard"},

tests/dom/dom.exp

@@ -1022,11 +1022,11 @@ References:
    traversal.js:188:74
     188|     document.createNodeIterator(document_body, -1, { acceptNode: node => 'accept' }); // invalid
                                                                                   ^^^^^^^^ [1]
-   <BUILTINS>/dom.js:4422:1
+   <BUILTINS>/dom.js:4410:1
          v--------------------------------
-   4422| typeof NodeFilter.FILTER_ACCEPT |
-   4423| typeof NodeFilter.FILTER_REJECT |
-   4424| typeof NodeFilter.FILTER_SKIP;
+   4410| typeof NodeFilter.FILTER_ACCEPT |
+   4411| typeof NodeFilter.FILTER_REJECT |
+   4412| typeof NodeFilter.FILTER_SKIP;
          ----------------------------^ [2]
    traversal.js:188:48
     188|     document.createNodeIterator(document_body, -1, { acceptNode: node => 'accept' }); // invalid
@@ -1398,11 +1398,11 @@ References:
    traversal.js:195:72
     195|     document.createTreeWalker(document_body, -1, { acceptNode: node => 'accept' }); // invalid
                                                                                 ^^^^^^^^ [1]
-   <BUILTINS>/dom.js:4422:1
+   <BUILTINS>/dom.js:4410:1
          v--------------------------------
-   4422| typeof NodeFilter.FILTER_ACCEPT |
-   4423| typeof NodeFilter.FILTER_REJECT |
-   4424| typeof NodeFilter.FILTER_SKIP;
+   4410| typeof NodeFilter.FILTER_ACCEPT |
+   4411| typeof NodeFilter.FILTER_REJECT |
+   4412| typeof NodeFilter.FILTER_SKIP;
          ----------------------------^ [2]
    traversal.js:195:46
     195|     document.createTreeWalker(document_body, -1, { acceptNode: node => 'accept' }); // invalid