Merge branch 'develop' into sf/form-transition-redirect-to

Author: jonasjabari

Gemfile.lock

@@ -121,7 +121,7 @@ GEM
     mini_portile2 (2.4.0)
     minitest (5.14.0)
     nio4r (2.5.2)
-    nokogiri (1.10.7)
+    nokogiri (1.10.8)
       mini_portile2 (~> 2.4.0)
     pipetree (0.1.1)
     pry (0.12.2)
@@ -133,7 +133,7 @@ GEM
     pry-rails (0.3.9)
       pry (>= 0.10.4)
     public_suffix (4.0.3)
-    puma (4.3.1)
+    puma (4.3.3)
       nio4r (~> 2.0)
     rack (2.2.1)
     rack-proxy (0.6.5)

app/concepts/matestack/ui/core/app/app.js

@@ -1,7 +1,6 @@
 import Vue from 'vue/dist/vue.esm'
 import VRuntimeTemplate from "v-runtime-template"
 import Vuex from 'vuex'
-import isNavigatingToAnotherPage from "./location"
 
 const componentDef = {
   props: ['appConfig', 'params'],
@@ -10,12 +9,14 @@ const componentDef = {
   },
   computed: Vuex.mapState({
     asyncTemplate: state => state.pageTemplate,
+    currentPath: state => state.currentPath
   }),
   mounted: function(){
+    const self = this;
     window.onpopstate = (event) => {
-      if (isNavigatingToAnotherPage(document.location, event)) {
-        this.$store.dispatch("navigateTo", {url: document.location.pathname, backwards: true} );
-      };
+      if (self.currentPath != document.location.pathname){
+        self.$store.dispatch("navigateTo", {url: document.location.pathname, backwards: true} );
+      }
     }
   },
   components: {

app/concepts/matestack/ui/core/app/location.js

@@ -6,7 +6,7 @@ ruby '2.6.5'
 # Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
 gem 'rails', '~> 5.2.0'
 # Use Puma as the app server
-gem 'puma', '~> 3.11'
+gem 'puma', '~> 3.12'
 # Use SCSS for stylesheets
 gem 'sass-rails', '~> 5.0'
 # Use Uglifier as compressor for JavaScript assets

builder/Gemfile

@@ -84,9 +84,9 @@ GEM
     minitest (5.14.0)
     msgpack (1.3.1)
     nio4r (2.5.2)
-    nokogiri (1.10.7)
+    nokogiri (1.10.8)
       mini_portile2 (~> 2.4.0)
-    puma (3.12.2)
+    puma (3.12.4)
     rack (2.1.2)
     rack-proxy (0.6.5)
       rack
@@ -168,7 +168,7 @@ DEPENDENCIES
   coffee-rails (~> 4.2)
   jbuilder (~> 2.5)
   listen (>= 3.0.5, < 3.2)
-  puma (~> 3.11)
+  puma (~> 3.12)
   rails (~> 5.2.0)
   sass-rails (~> 5.0)
   tzinfo-data

builder/Gemfile.lock

@@ -3,7 +3,7 @@
 
 describe "Transition Component", type: :feature, js: true do
 
-  it "Example 1 - Perform transition from one page to another without page reload if related to app" do
+  before :all do
 
     class Apps::ExampleApp < Matestack::Ui::App
 
@@ -78,6 +78,10 @@ def page2
     end
     Rails.application.reload_routes!
 
+  end
+
+  it "Example 1 - Perform transition from one page to another without page reload if related to app" do
+
     visit "/my_example_app/page1"
 
     expect(page).to have_content("My Example App Layout")
@@ -113,6 +117,44 @@ def page2
     expect(first_content_on_page_1).not_to eq(refreshed_content_on_page_1)
   end
 
+  it "Example 2 - Perform transition from one page to another without page reload when using page history buttons" do
+
+    visit "/my_example_app/page1"
+
+    expect(page).to have_content("My Example App Layout")
+    expect(page).to have_button("Page 1")
+    expect(page).to have_button("Page 2")
+
+    expect(page).to have_content("This is Page 1")
+    expect(page).not_to have_content("This is Page 2")
+
+    element = page.find("#my-div-on-page-1")
+    first_content_on_page_1 = element.text
+
+    page.evaluate_script('document.body.classList.add("not-reloaded")')
+    expect(page).to have_selector("body.not-reloaded")
+
+    click_button("Page 2")
+
+    expect(page).to have_content("My Example App Layout")
+    expect(page).not_to have_content("This is Page 1")
+    expect(page).to have_content("This is Page 2")
+    expect(page).to have_selector("body.not-reloaded")
+
+    # page.evaluate_script('window.history.back()')
+    page.go_back
+
+    element = page.find("#my-div-on-page-1")
+    refreshed_content_on_page_1 = element.text
+
+    expect(page).to have_content("My Example App Layout")
+    expect(page).to have_content("This is Page 1")
+    expect(page).not_to have_content("This is Page 2")
+    expect(page).to have_selector("body.not-reloaded")
+
+    expect(first_content_on_page_1).not_to eq(refreshed_content_on_page_1)
+  end
+
   # supposed to work, but doesn't. Suspect Vue is the culprint here
   # it "Example 2 - Perform transition from one page to another by providing route as string (not recommended)" do
   #