Use .getState() instead of .serialize() when mutating panes

spec/app/pane-container-replication-spec.coffee

@@ -4,14 +4,14 @@ PaneContainer = require 'pane-container'
 Pane = require 'pane'
 
 describe "PaneContainer replication", ->
-  [container1, pane1a, pane1b, pane1c] = []
-  [container2, pane2a, pane2b, pane2c] = []
+  [container1, container2, pane1a, pane1b, pane1c] = []
 
   class TestView extends View
     @deserialize: ({name}) -> new TestView(name)
     @content: -> @div tabindex: -1
     initialize: (@name) -> @text(@name)
     serialize: -> { deserializer: 'TestView', @name }
+    getState: -> @serialize()
     getUri: -> "/tmp/#{@name}"
     isEqual: (other) -> @name is other.name
 
@@ -63,7 +63,6 @@ describe "PaneContainer replication", ->
     expect(container2.find('.row > :eq(1) > :eq(0):contains(D)')).toExist()
     expect(container2.find('.row > :eq(1) > :eq(1):contains(E)')).toExist()
 
-
   it "replicates removal of panes", ->
     pane1c.remove()
 

src/app/edit-session.coffee

@@ -87,6 +87,8 @@ class EditSession
     scrollLeft: @getScrollLeft()
     cursorScreenPosition: @getCursorScreenPosition().serialize()
 
+  getState: -> @serialize()
+
   # Creates a copy of the current {EditSession}.Returns an identical `EditSession`.
   copy: ->
     EditSession.deserialize(@serialize(), @project)

src/app/pane-axis.coffee

@@ -74,21 +74,20 @@ class PaneAxis extends View
     newChild.insertBefore(child)
     if options.updateState ? true
       children = @state.get('children')
-      childIndex = children.indexOf(child.serialize())
-      children.insert(childIndex, newChild.serialize())
+      childIndex = children.indexOf(child.getState())
+      children.insert(childIndex, newChild.getState())
 
   insertChildAfter: (child, newChild) ->
     newChild.insertAfter(child)
     children = @state.get('children')
-    childIndex = children.indexOf(child.serialize())
-    children.insert(childIndex + 1, newChild.serialize())
+    childIndex = children.indexOf(child.getState())
+    children.insert(childIndex + 1, newChild.getState())
 
   serialize: ->
     child.serialize() for child in @children().views()
     @state
 
-  childViewStates: ->
-    $(child).view().serialize() for child in @children()
+  getState: -> @state
 
   horizontalChildUnits: ->
     $(child).view().horizontalGridUnits() for child in @children()

src/app/pane-container.coffee

@@ -90,7 +90,7 @@ class PaneContainer extends View
   setRoot: (root, options={}) ->
     @empty()
     @append(root) if root?
-    @state.set(root: root?.serialize() ? null) if options.updateState ? true
+    @state.set(root: root?.getState()) if options.updateState ? true
 
   removeChild: (child) ->
     throw new Error("Removing non-existant child") unless @getRoot() is child

src/app/pane.coffee

@@ -32,7 +32,7 @@ class Pane extends View
     else
       @items = args
       @state = telepath.Document.fromObject
-        items: @items.map (item) -> item.serialize()
+        items: @items.map (item) -> item.getState?() ? item.serialize()
 
     @state.get('items').observe ({index, value, type, site}) =>
       return if site is @state.site.id
@@ -155,7 +155,7 @@ class Pane extends View
   addItem: (item, index=@getActiveItemIndex()+1, options={}) ->
     return if _.include(@items, item)
 
-    @state.get('items').splice(index, 0, item.serialize()) if options.updateState ? true
+    @state.get('items').splice(index, 0, item.getState?() ? item.serialize()) if options.updateState ? true
     @items.splice(index, 0, item)
     @getContainer().itemAdded(item)
     @trigger 'pane:item-added', [item, index]
@@ -245,7 +245,7 @@ class Pane extends View
     @items.splice(oldIndex, 1)
     @items.splice(newIndex, 0, item)
     @state.get('items').splice(oldIndex, 1)
-    @state.get('items').splice(newIndex, 0, item.serialize())
+    @state.get('items').splice(newIndex, 0, item.getState?() ? item.serialize())
     @trigger 'pane:item-moved', [item, newIndex]
 
   moveItemToPane: (item, pane, index) ->
@@ -278,7 +278,7 @@ class Pane extends View
         viewToRemove?.remove()
     else
       viewToRemove?.detach() if @isMovingItem and item is viewToRemove
-      @remove()
+      @parent().view().removeChild(this, updateState: false)
 
   viewForItem: (item) ->
     if item instanceof $
@@ -301,6 +301,8 @@ class Pane extends View
       activeItemUri: @activeItem.getUri?()
     @state
 
+  getState: -> @state
+
   adjustDimensions: -> # do nothing
 
   horizontalGridUnits: -> 1