1. /* global chrome */

  2. 

  3. export function setBrowserSelectionFromReact() {

  4.   // This is currently only called on demand when you press "view DOM".

  5.   // In the future, if Chrome adds an inspect() that doesn't switch tabs,

  6.   // we could make this happen automatically when you select another component.

  7.   chrome.devtools.inspectedWindow.eval(

  8.     '(window.__REACT_DEVTOOLS_GLOBAL_HOOK__.$0 !== $0) ?' +

  9.       '(inspect(window.__REACT_DEVTOOLS_GLOBAL_HOOK__.$0), true) :' +

  10.       'false',

  11.     (didSelectionChange, evalError) => {

  12.       if (evalError) {

  13.         console.error(evalError);

  14.       }

  15.     },

  16.   );

  17. }

  18. 

  19. export function setReactSelectionFromBrowser(bridge) {

  20.   // When the user chooses a different node in the browser Elements tab,

  21.   // copy it over to the hook object so that we can sync the selection.

  22.   chrome.devtools.inspectedWindow.eval(

  23.     '(window.__REACT_DEVTOOLS_GLOBAL_HOOK__ && window.__REACT_DEVTOOLS_GLOBAL_HOOK__.$0 !== $0) ?' +

  24.       '(window.__REACT_DEVTOOLS_GLOBAL_HOOK__.$0 = $0, true) :' +

  25.       'false',

  26.     (didSelectionChange, evalError) => {

  27.       if (evalError) {

  28.         console.error(evalError);

  29.       } else if (didSelectionChange) {

  30.         if (!bridge) {

  31.           console.error(

  32.             'Browser element selection changed, but bridge was not initialized',

  33.           );

  34.           return;

  35.         }

  36. 

  37.         // Remember to sync the selection next time we show Components tab.

  38.         bridge.send('syncSelectionFromNativeElementsPanel');

  39.       }

  40.     },

  41.   );

  42. }
About Sign Up Leave Feedback Contact