React tab is blank when third-party cookies are blocked

[ivan]

If I use React Developer Tools in a Chrome profile that has "Block third-party cookies and site data" enabled in Content settings, the contents of the React tab are completely blank. Inspecting the inspector shows these errors:

Uncaught SecurityError: Access to 'localStorage' is denied for this document. Settings.js:131
Uncaught TypeError: Cannot read property 'domWordWrap' of undefined ReactPanel.js:67

The errors are thrown from these lines:

https://github.com/sebmarkbage/blink-devtools/blob/120a03721f07ecab689e5aa2444ed26094e5ede0/Source/devtools/front_end/Settings.js#L131

react-devtools/views/components/ReactPanel.js

Line 67 in 9879bdc

if (!WebInspector.settings.domWordWrap.get())

The relevant Chrome bug is https://code.google.com/p/chromium/issues/detail?id=319328#c4

If it isn't worth fixing, it might be worth detecting the problem and telling the user to disable third-party cookie blocking.

[sophiebits]

I made a change to the README in #7. Personally, I don't think it's worth fixing as it's inconvenient to rewrite all of blink-devtools to use chrome.storage instead. Detecting might be useful though.

[sebmarkbage]

Well, we could polyfill it. Even an async api can be read in full at load. Then stored synchronously in memory, only to be occasionally flushed asynchronously.

We need a better start up page with relevant error information.

[kdzwinel]

Don't rewrite it using chrome.storage, it won't work either - https://code.google.com/p/chromium/issues/detail?id=178618 . I use background page for all localStorage access due to these bugs: https://github.com/kdzwinel/SnappySnippet/blob/master/js/background.js .

[irae]

I found out a workaround. I added the chrome extension ID to the list of exceptions:

Looks like this will make localStorage available to the extension, without the need to change your privacy settings.

I agree with Sebastian that a better startup page would be great, and this workaround can actually be included as a warning message if such page exists in the future.

[sophiebits]

@irae Thanks, good find.

[jarohen]

Thanks :) The (copyable) chrome extension ID is fmkadmapgofadopljbjfkapdkoienihi

[jaredly]

the newly released beta version works just fine w/ third-party cookies blocked.
Let us know if you run into any other issues!