From c560e9367b56bd189ce5570749b93e8707d7a4e0 Mon Sep 17 00:00:00 2001 From: Omar Sy Date: Fri, 14 Aug 2020 22:47:02 +0200 Subject: [PATCH 1/7] Add html_all_collection type to correct typeof document.all --- packages/react-devtools-shared/src/hydration.js | 1 + packages/react-devtools-shared/src/utils.js | 4 ++++ 2 files changed, 5 insertions(+) diff --git a/packages/react-devtools-shared/src/hydration.js b/packages/react-devtools-shared/src/hydration.js index f46048f75e646..efbf715b7c2a8 100644 --- a/packages/react-devtools-shared/src/hydration.js +++ b/packages/react-devtools-shared/src/hydration.js @@ -219,6 +219,7 @@ export function dehydrate( ), ); + case 'html_all_collection': case 'typed_array': case 'iterator': isPathAllowedCheck = isPathAllowed(path); diff --git a/packages/react-devtools-shared/src/utils.js b/packages/react-devtools-shared/src/utils.js index 3472e2c6dba9c..ce1bf082488a9 100644 --- a/packages/react-devtools-shared/src/utils.js +++ b/packages/react-devtools-shared/src/utils.js @@ -372,6 +372,7 @@ export type DataType = | 'data_view' | 'date' | 'function' + | 'html_all_collection' | 'html_element' | 'infinity' | 'iterator' @@ -447,6 +448,9 @@ export function getDataType(data: Object): DataType { case 'symbol': return 'symbol'; default: + if (data instanceof HTMLAllCollection) { + return 'html_all_collection'; + } return 'unknown'; } } From f9f6e3fe39e708fdbe91d6d102fc36fa61d69dc4 Mon Sep 17 00:00:00 2001 From: Omar SY Date: Fri, 21 Aug 2020 10:53:22 +0200 Subject: [PATCH 2/7] process HTMLAllCollection like HTMLElement + fix flow issue --- packages/react-devtools-shared/src/utils.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/packages/react-devtools-shared/src/utils.js b/packages/react-devtools-shared/src/utils.js index 345c826623400..1acf5d1772780 100644 --- a/packages/react-devtools-shared/src/utils.js +++ b/packages/react-devtools-shared/src/utils.js @@ -406,6 +406,11 @@ export function getDataType(data: Object): DataType { return 'html_element'; } + // $FlowFixMe Flow doesn't know about HTMLAllCollection + if (typeof HTMLAllCollection !== 'undefined' && data instanceof HTMLAllCollection) { + return 'html_all_collection'; + } + const type = typeof data; switch (type) { case 'bigint': @@ -448,9 +453,6 @@ export function getDataType(data: Object): DataType { case 'symbol': return 'symbol'; default: - if (data instanceof HTMLAllCollection) { - return 'html_all_collection'; - } return 'unknown'; } } From 963453001b146ba490acecf63d0b1ab19bb3423a Mon Sep 17 00:00:00 2001 From: Omar SY Date: Fri, 21 Aug 2020 11:03:18 +0200 Subject: [PATCH 3/7] fix lint --- packages/react-devtools-shared/src/utils.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/react-devtools-shared/src/utils.js b/packages/react-devtools-shared/src/utils.js index 1acf5d1772780..b3cf32d412f13 100644 --- a/packages/react-devtools-shared/src/utils.js +++ b/packages/react-devtools-shared/src/utils.js @@ -407,7 +407,10 @@ export function getDataType(data: Object): DataType { } // $FlowFixMe Flow doesn't know about HTMLAllCollection - if (typeof HTMLAllCollection !== 'undefined' && data instanceof HTMLAllCollection) { + if ( + typeof HTMLAllCollection !== 'undefined' && + data instanceof HTMLAllCollection + ) { return 'html_all_collection'; } From e96b90d87317672dee1412918f32cac9214a46b4 Mon Sep 17 00:00:00 2001 From: Omar SY Date: Fri, 21 Aug 2020 11:24:57 +0200 Subject: [PATCH 4/7] move flow fix comment --- packages/react-devtools-shared/src/utils.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-devtools-shared/src/utils.js b/packages/react-devtools-shared/src/utils.js index b3cf32d412f13..13451d2c1dea2 100644 --- a/packages/react-devtools-shared/src/utils.js +++ b/packages/react-devtools-shared/src/utils.js @@ -406,8 +406,8 @@ export function getDataType(data: Object): DataType { return 'html_element'; } - // $FlowFixMe Flow doesn't know about HTMLAllCollection if ( + // $FlowFixMe Flow doesn't know about HTMLAllCollection typeof HTMLAllCollection !== 'undefined' && data instanceof HTMLAllCollection ) { From 40e2e1f0e7d3a78908622036abbfc1ab49d8f3a5 Mon Sep 17 00:00:00 2001 From: Omar SY Date: Fri, 21 Aug 2020 12:46:07 +0200 Subject: [PATCH 5/7] Make it work with iframes too --- packages/react-devtools-shared/src/utils.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/packages/react-devtools-shared/src/utils.js b/packages/react-devtools-shared/src/utils.js index 13451d2c1dea2..a072cf8eb1826 100644 --- a/packages/react-devtools-shared/src/utils.js +++ b/packages/react-devtools-shared/src/utils.js @@ -406,11 +406,7 @@ export function getDataType(data: Object): DataType { return 'html_element'; } - if ( - // $FlowFixMe Flow doesn't know about HTMLAllCollection - typeof HTMLAllCollection !== 'undefined' && - data instanceof HTMLAllCollection - ) { + if (Object.prototype.toString.call(data) === '[object HTMLAllCollection]') { return 'html_all_collection'; } From e8e9fa250b4f61e3bf84f74127052e8dbd44bb77 Mon Sep 17 00:00:00 2001 From: Omar SY Date: Fri, 21 Aug 2020 14:27:54 +0200 Subject: [PATCH 6/7] optimize how we get html_all_collection type --- packages/react-devtools-shared/src/utils.js | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/packages/react-devtools-shared/src/utils.js b/packages/react-devtools-shared/src/utils.js index a072cf8eb1826..4d131318773d2 100644 --- a/packages/react-devtools-shared/src/utils.js +++ b/packages/react-devtools-shared/src/utils.js @@ -406,10 +406,6 @@ export function getDataType(data: Object): DataType { return 'html_element'; } - if (Object.prototype.toString.call(data) === '[object HTMLAllCollection]') { - return 'html_all_collection'; - } - const type = typeof data; switch (type) { case 'bigint': @@ -445,12 +441,23 @@ export function getDataType(data: Object): DataType { return 'regexp'; } else if (Object.prototype.toString.call(data) === '[object Date]') { return 'date'; + } else if ( + Object.prototype.toString.call(data) === '[object HTMLAllCollection]' + ) { + return 'html_all_collection'; } return 'object'; case 'string': return 'string'; case 'symbol': return 'symbol'; + case 'undefined': + if ( + Object.prototype.toString.call(data) === '[object HTMLAllCollection]' + ) { + return 'html_all_collection'; + } + return 'undefined'; default: return 'unknown'; } From 43569274336f993bc178060d0c278bc96dfa255b Mon Sep 17 00:00:00 2001 From: Omar SY Date: Fri, 21 Aug 2020 15:20:45 +0200 Subject: [PATCH 7/7] use once Object.prototype.toString.call --- packages/react-devtools-shared/src/utils.js | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/packages/react-devtools-shared/src/utils.js b/packages/react-devtools-shared/src/utils.js index 4d131318773d2..87f845105b528 100644 --- a/packages/react-devtools-shared/src/utils.js +++ b/packages/react-devtools-shared/src/utils.js @@ -439,12 +439,13 @@ export function getDataType(data: Object): DataType { return 'iterator'; } else if (data.constructor && data.constructor.name === 'RegExp') { return 'regexp'; - } else if (Object.prototype.toString.call(data) === '[object Date]') { - return 'date'; - } else if ( - Object.prototype.toString.call(data) === '[object HTMLAllCollection]' - ) { - return 'html_all_collection'; + } else { + const toStringValue = Object.prototype.toString.call(data); + if (toStringValue === '[object Date]') { + return 'date'; + } else if (toStringValue === '[object HTMLAllCollection]') { + return 'html_all_collection'; + } } return 'object'; case 'string':