Merge pull request #499 from matestack/next_release

1.3.1 Release

Author: jonasjabari

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## v1.3.1 Release
+
+### Bugfixes
+
+- Fixes #497 Cable component throws browser error when initial content contains form component
+
 ## v1.3.0 Release
 
 ### Potential breaking change

app/concepts/matestack/ui/core/cable/cable.haml

@@ -1,4 +1,4 @@
-%component{dynamic_tag_attributes.merge('initial-template': "#{render_content}")}
+%component{dynamic_tag_attributes.merge('v-bind:initial-template': "#{render_content.to_json}")}
   %div{class: "matestack-cable-component-container", "v-bind:class": "{ 'loading': loading === true }"}
     %div{class: "matestack-cable-component-wrapper", "v-if": "cableTemplate != null", "v-bind:class": "{ 'loading': loading === true }"}
       %v-runtime-template{":template":"cableTemplate"}

lib/matestack/ui/core/version.rb

@@ -1,7 +1,7 @@
 module Matestack
   module Ui
     module Core
-      VERSION = '1.3.0'
+      VERSION = '1.3.1'
     end
   end
 end

package.json

@@ -1,6 +1,6 @@
 {
   "name": "matestack-ui-core",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "main": "app/javascript/matestack-ui-core",
   "private": true,
   "dependencies": {

spec/test/components/dynamic/cable/cable_spec.rb

@@ -4,6 +4,10 @@
   include Utils
   include Matestack::Ui::Core::ApplicationHelper
 
+  before :each do
+
+  end
+
   it 'should have the typical matestack wrapping classes' do
     matestack_render do
       cable id: 'foobar' do
@@ -42,7 +46,7 @@
     expect(page).to have_selector('h1#id', text: 'replaced')
     reset_matestack_app
   end
-  
+
   it 'should be possible to add vue.js components' do
     matestack_render do
       cable id: 'cable-replace', replace_on: 'replace' do
@@ -67,4 +71,46 @@
     expect(page).to have_content('event successful emitted')
   end
 
+  it 'should render Vue.js components and forms without Vue.js console error' do
+    # unfortunately I can't test this as I'm not getting the browsers console.log via capybara/Selenium
+    # tried all hints found on Stackoverflow etc
+    matestack_render do
+      cable id: 'cable-replace', replace_on: 'replace' do
+        form for: :some_object, path: "/", method: :post do
+          form_input key: :foo, type: :text, label: :foo, id: :foo
+        end
+      end
+    end
+
+    # this was throwing a console error in v.1.3.0
+    # "Interpolation inside attributes has been removed. Use v-bind or the colon shorthand instead. For example, instead of <div id="{{ val }}">, use <div :id="val">."
+    # fixed in v.1.3.1 without explicitly testing it...
+
+    expect(page).to have_selector('form')
+    expect(page).to have_selector('input#foo')
+  end
+
+  it 'should work without any initial body given' do
+    matestack_render do
+      cable id: 'cable-replace', replace_on: 'replace' do
+        # nothing
+      end
+      toggle show_on: 'test' do
+        plain 'event successful emitted'
+      end
+    end
+
+    expect(page).not_to have_content('event successful emitted')
+
+    onclick = matestack_component(:onclick, emit: :test) { button text: 'Click' }
+    script = "MatestackUiCore.matestackEventHub.$emit('replace', { data: \"#{onclick}\" })".gsub("\n", "")
+    page.execute_script(script)
+
+    expect(page).to have_selector('button', text: 'Click')
+    expect(page).not_to have_content('event successful emitted')
+
+    click_on 'Click'
+    expect(page).to have_content('event successful emitted')
+  end
+
 end