Inspector: Create New DOM Storage Items via DataGrid

• Component: Web Inspector (Deprecated)
• Status: RESOLVED FIXED

[Joseph Pecoraro]

The DataGrid for DOM Storage (localStorage and sessionStorage) should be more interactive.  This will allow a lot more interaction, including creating Elements.

[Joseph Pecoraro]

Created attachment 32821 [details]
Make DOM Storage DataGrid More Interactive

- Added a "CreationDataGridNode" type that can delete its special data and transform back into a normal DataGridNode.
- Added a reference in the DataGrid to a CreationDataNode if one exists: @see addCreationNode()
- Clicking anywhere in the excess space will select the bottom row (an existing blank row)
- DOM Storage specific logic forces it to select the leftmost td (to set a Key)

I see a potential problem with sorting the GridData table.  However, sorting wasn't working for me to begin with (was it ever working).  However, the special CreationDataNode, if it exists, has this.isCreationNode and thus can easily be sorted last.

[Timothy Hatcher]

Comment on attachment 32821 [details]
Make DOM Storage DataGrid More Interactive

> +        if (this._editingNode.isCreationNode) {
> +            element = this._editingNode._element.children[0]; // Leftmost Column
> +        }

No need for the braces here.

What does the creation row look like?

[Joseph Pecoraro]

This is what the functionality looks like:
http://screencast.com/t/ngFWrjWN6M

Updating the patch with a few style fixes and that "select()" the creation row so that you don't accidently delete something in the background.  That new patch will be up in a second.

[Joseph Pecoraro]

Created attachment 33577 [details]
Make DOM Storage DataGrid More Interactive

NOTES:

- Style fixes
- Added the select() call to prevent unwanted deletions

[Timothy Hatcher]

Comment on attachment 33577 [details]
Make DOM Storage DataGrid More Interactive

> +        var cnt = 0;
> +        for (var i in this.columns)
> +            emptyData[cnt++] = '';

This looks funny. Shouldn't this just be:

for (var column in this.columns)
    emptyData[column] = '';

[David Levin]

Comment on attachment 32821 [details]
Make DOM Storage DataGrid More Interactive

Clearing r+ on obsolete patch to move out of commit queue.

[Joseph Pecoraro]

Created attachment 33689 [details]
Fixed the Loop

[Joseph Pecoraro]

(In reply to comment #5)
> (From update of attachment 33577 [details])
> > +        var cnt = 0;
> > +        for (var i in this.columns)
> > +            emptyData[cnt++] = '';
> 
> This looks funny. Shouldn't this just be:
> 
> for (var column in this.columns)
>     emptyData[column] = '';

Done.

[Timothy Hatcher]

http://trac.webkit.org/changeset/46519