davidmaxwaterman@, Please attach a sample test file to reproduce this issue.

Any localstorage demo will do. Here's one in the iron-localstorage page on webcomponents.org:

1. https://www.webcomponents.org/element/PolymerElements/iron-localstorage/demo/demo/index.html
2. open dev tools
3. select application tab
4. open 'local storage'
5. select 'https://raw-dot-custom-elements.appspot.com'

observe in the right pane, they value for key 'polymer-localstorage-x-test1' is '{"name":"idiot","hasEars":false}'.

this bug is about making it more like if you run the following in the console:

console.log(JSON.parse('{"name":"idiot","hasEars":false}'))

something like:

v Object {name: "idiot", hasEars: false}
    hasEars: false
    name: "idiot"
   >__proto__: Object

Note that there are at least a couple of chrome extensions that are specifically there to better present data structures stored as json as the value in localstorage (and other storage types).

Another example is jsbin.com:

1. open http://jsbin.com
2. follow above instructions
3. notice fonts, keys, settings and splitterSettings are all objects (I guess they're just json strings, but perhaps not).

Tested the issue on windows 10 & 7 using chrome stable M59 #59.0.3071.115 and canary M61 #61.0.3148.0 and followed the steps as mentioned in comment #2 .

Attached screencast for reference.

@davidmaxwaterman-- Could you please provide us the expected and actual result screensots or video , that would really help us in understanding the issue better.

Thanks!

Deleted: 738065.mp4 2.2 MB

	738065.mp4 2.2 MB View Download

Yes, that video shows the problem nicely, thanks for doing that.

Actually, I've since realised it is easier to just do:

JSON.parse(localStorage['polymer-localstorage-x-test1'])

From the video, it seems like you think I'm reporting an error. That's not correct.

The data shown in the Application/localstorage is correct, it's just that it is shown as a string. When that string is JSON, showing it as a string isn't very useful.

What I usually end up doing, as I mentioned, using the console to call JSON.parse() on the string. The output of that command allows me to browse the data structure.

Yes, with the small example I gave, it doesn't make much different, but it doesn't take much more for the string to overflow the field in the Application/localstorage UI.

This issue is asking for a feature in chrome dev tools to do the JSON.parse() for me inside Application/localstorage (something like how it is done in the network panel for xhr responses that are json).

Perhaps it's not as simple as I think to recognise that a string is JSON, but it sure would be nice.

Thank you for providing more feedback. Adding requester "hdodda@chromium.org" to the cc list and removing "Needs-Feedback" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot

I believe this is currently being worked on. Eugene, can you please confirm and/or give update?

Thanks.

This is not in an active development, but is definitely a something that should be considered.

I am adding a small preview pane beneath the table.

Deleted: storage_preview.png 67.0 KB

	storage_preview.png 67.0 KB View Download

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/dbbf416457cc0fbf9797b24b33eb406dd5d235f1

commit dbbf416457cc0fbf9797b24b33eb406dd5d235f1
Author: Eugene Ostroukhov <eostroukhov@chromium.org>
Date: Thu Oct 19 19:39:00 2017

[DevTools] Add a preview pane to storage panes

Bug:  738065 
Change-Id: I1ca301942f151bea6a1665a02bc58a89b0eb2ad7
Reviewed-on: https://chromium-review.googlesource.com/726840
Reviewed-by: Andrey Kosyakov <caseq@chromium.org>
Commit-Queue: Eugene Ostroukhov <eostroukhov@chromium.org>
Cr-Commit-Position: refs/heads/master@{#510162}
[modify] https://crrev.com/dbbf416457cc0fbf9797b24b33eb406dd5d235f1/third_party/WebKit/Source/devtools/front_end/resources/DOMStorageItemsView.js
[modify] https://crrev.com/dbbf416457cc0fbf9797b24b33eb406dd5d235f1/third_party/WebKit/Source/devtools/front_end/resources/ServiceWorkerCacheViews.js
[modify] https://crrev.com/dbbf416457cc0fbf9797b24b33eb406dd5d235f1/third_party/WebKit/Source/devtools/front_end/resources/resourcesPanel.css
[modify] https://crrev.com/dbbf416457cc0fbf9797b24b33eb406dd5d235f1/third_party/WebKit/Source/devtools/front_end/resources/serviceWorkerCacheViews.css

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/9fa18dd004f0c6721e597a512b12f1299f860460

commit 9fa18dd004f0c6721e597a512b12f1299f860460
Author: Eugene Ostroukhov <eostroukhov@chromium.org>
Date: Fri Oct 20 16:37:00 2017

Revert "[DevTools] Add a preview pane to storage panes"

This reverts commit dbbf416457cc0fbf9797b24b33eb406dd5d235f1.

Reason for revert: <INSERT REASONING HERE>

Original change's description:
> [DevTools] Add a preview pane to storage panes
> 
> Bug:  738065 
> Change-Id: I1ca301942f151bea6a1665a02bc58a89b0eb2ad7
> Reviewed-on: https://chromium-review.googlesource.com/726840
> Reviewed-by: Andrey Kosyakov <caseq@chromium.org>
> Commit-Queue: Eugene Ostroukhov <eostroukhov@chromium.org>
> Cr-Commit-Position: refs/heads/master@{#510162}

TBR=caseq@chromium.org,allada@chromium.org,eostroukhov@chromium.org

Change-Id: I99b724b9396168bdd2ddcfff03ba0bf50c84ff55
No-Presubmit: true
No-Tree-Checks: true
No-Try: true
Bug:  738065 
Reviewed-on: https://chromium-review.googlesource.com/728960
Reviewed-by: Andrey Kosyakov <caseq@chromium.org>
Commit-Queue: Andrey Kosyakov <caseq@chromium.org>
Cr-Commit-Position: refs/heads/master@{#510462}
[modify] https://crrev.com/9fa18dd004f0c6721e597a512b12f1299f860460/third_party/WebKit/Source/devtools/front_end/resources/DOMStorageItemsView.js
[modify] https://crrev.com/9fa18dd004f0c6721e597a512b12f1299f860460/third_party/WebKit/Source/devtools/front_end/resources/ServiceWorkerCacheViews.js
[modify] https://crrev.com/9fa18dd004f0c6721e597a512b12f1299f860460/third_party/WebKit/Source/devtools/front_end/resources/resourcesPanel.css
[modify] https://crrev.com/9fa18dd004f0c6721e597a512b12f1299f860460/third_party/WebKit/Source/devtools/front_end/resources/serviceWorkerCacheViews.css

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/62f757cf193455349ddf045bfc15e2e48b649ae6

commit 62f757cf193455349ddf045bfc15e2e48b649ae6
Author: Eugene Ostroukhov <eostroukhov@chromium.org>
Date: Wed Nov 01 01:37:44 2017

[DevTools] Add a preview pane to storage panes

Bug:  738065 
Change-Id: Ia706f3a5edd451de462ab8c6a26abc394d493e9e
Reviewed-on: https://chromium-review.googlesource.com/731405
Commit-Queue: Eugene Ostroukhov <eostroukhov@chromium.org>
Reviewed-by: Andrey Kosyakov <caseq@chromium.org>
Cr-Commit-Position: refs/heads/master@{#513040}
[modify] https://crrev.com/62f757cf193455349ddf045bfc15e2e48b649ae6/third_party/WebKit/Source/devtools/front_end/resources/DOMStorageItemsView.js

I've been a a couple of months since this was fixed. I'm wondering when it will see the light of day and/or how I can give it a go. Can anyone tell me?