Fixing up ScrollComponent.wrap

We now keep the original layer as the content layer, so you can continue to set click handlers on it and get expected results. Also, more tests.

framer/Components/ScrollComponent.coffee

@@ -409,10 +409,27 @@ wrapComponent = (instance, layer, options = {correct:true}) ->
 			layer.x = layer.y = 0
 			layer = wrapper
 
-			console.log "Corrected the scroll component without sub layers"
-
-	for propKey in ["frame", "image", "name"]
-		scroll[propKey] = layer[propKey]
+			# console.info "Corrected the scroll component without sub layers"
+
+	scroll.frame = layer.frame
+	scroll.superLayer = layer.superLayer
+	scroll.index = layer.index
+
+	# Copy over the name, if we don't have it try to use the variable
+	# name from Framer Studio if it was given.
+	if layer.name and layer.name isnt ""
+		scroll.name = layer.name
+	else if layer.__framerInstanceInfo?.name
+		scroll.name = layer.__framerInstanceInfo.name
+
+	# If we have an image set, it makes way more sense to add it to the
+	# background of the wrapper then the content.
+	if layer.image
+		scroll.image = layer.image
+		layer.image = null
+
+	# Set the original layer as the content layer for the scroll
+	scroll.setContentLayer(layer)
 
 	# https://github.com/motif/Company/issues/208
 
@@ -433,23 +450,11 @@ wrapComponent = (instance, layer, options = {correct:true}) ->
 		if screenFrame.x < Screen.width
 			if screenFrame.x + screenFrame.width > Screen.width
 				scroll.width = Screen.width - screenFrame.x
-				console.log "Corrected the scroll width to #{scroll.width}"
+				# console.info "Corrected the scroll width to #{scroll.width}"
 
 		if screenFrame.y < Screen.height
 			if screenFrame.y + screenFrame.height > Screen.height
 				scroll.height = Screen.height - screenFrame.y
-				console.log "Corrected the scroll height to #{scroll.height}"
+				# console.info "Corrected the scroll height to #{scroll.height}"
 
-
-	# Now copy over all the content to the new scroll component
-	for subLayer in layer.subLayers
-		subLayerIndex = subLayer.index
-		subLayer.superLayer = scroll.content
-		subLayer.index = subLayerIndex
-
-	scroll.superLayer = layer.superLayer
-	scroll.index = layer.index
-
-	layer.destroy()
-
 	return scroll

test/tests/ScrollComponentTest.coffee

@@ -1,35 +1,71 @@
-expect = chai.expect
 
 describe "ScrollComponent", ->
 
-  it "should apply constructor options", ->
+	it "should apply constructor options", ->
 
-    instance = new ScrollComponent (scrollHorizontal: false)
-    instance.scrollHorizontal.should.be.false
+		instance = new ScrollComponent (scrollHorizontal: false)
+		instance.scrollHorizontal.should.be.false
 
-  it "should keep scrollHorizontal value on copy", ->
+	it "should keep scrollHorizontal value on copy", ->
 
-    instance = new ScrollComponent (scrollHorizontal: false)
-    instance.scrollHorizontal.should.be.false
+		instance = new ScrollComponent (scrollHorizontal: false)
+		instance.scrollHorizontal.should.be.false
 
-    copy = instance.copy()
-    copy.scrollHorizontal.should.be.false
+		copy = instance.copy()
+		copy.scrollHorizontal.should.be.false
 
-  describe "wrap", ->
+	describe "wrap", ->
 
-    it "should forward constructor options", ->
-      options =
-        scrollVertical: false
-        mouseWheelEnabled: true
-        name: "is a name"
-        backgroundColor: new Color r:0, g:0, b:0, a:0
-        color: new Color r:255, g:255, b:255, a:1
-        shadowColor: new Color r:0, g:0, b:0, a:1
+		it "should use the wrapped layer as content layer when there are sublayers", ->
 
-      # 'wrap' ports the 'name' of the layer onto the ScrollComponent
-      layer = new Layer name: options.name
-      layer.name.should.equal(options.name)
+			layerA = new Layer frame:Screen.frame
+			layerB = new Layer superLayer:layerA
 
-      scroller = ScrollComponent.wrap layer, options
-      for key in _.keys options
-        expect(scroller[key]).to.equal(options[key])
+			scroll = ScrollComponent.wrap(layerA)
+			scroll.content.should.equal layerA
+
+		it "should use the wrapped layer as content if there are no sublayers", ->
+
+			layerA = new Layer frame:Screen.frame
+
+			scroll = ScrollComponent.wrap(layerA)
+			scroll.content.subLayers[0].should.equal layerA
+
+		it "should copy the name and image", ->
+
+			layerA = new Layer frame:Screen.frame, name:"Koen", image:"../static/test.png"
+			layerB = new Layer superLayer:layerA
+
+			scroll = ScrollComponent.wrap(layerA)
+
+			scroll.name.should.equal "Koen"
+			scroll.image.should.equal "../static/test.png"
+
+			scroll.content.should.equal layerA
+			scroll.content.name.should.equal "content"
+			scroll.content.image.should.equal ""
+
+		it "should correct the scroll frame", ->
+
+			frame = Screen.frame
+			frame.width += 100
+			frame.height += 100
+
+			layerA = new Layer frame:frame
+
+			scroll = ScrollComponent.wrap(layerA)
+			scroll.width.should.equal Screen.width
+			scroll.height.should.equal Screen.height
+
+		it "should correct the scroll frame with sublayers", ->
+
+			frame = Screen.frame
+			frame.width += 100
+			frame.height += 100
+
+			layerA = new Layer frame:frame
+			layerB = new Layer superLayer:layerA
+
+			scroll = ScrollComponent.wrap(layerA)
+			scroll.width.should.equal Screen.width
+			scroll.height.should.equal Screen.height