Merge branch 'develop' of github.com:basemate/matestack-ui-core into develop

Author: jonasjabari

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

@@ -1,6 +1,7 @@
 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'],
@@ -9,12 +10,18 @@ const componentDef = {
   },
   computed: Vuex.mapState({
     asyncTemplate: state => state.pageTemplate,
-    currentPath: state => state.currentPath
+    currentPathName: state => state.currentPathName,
+    currentSearch: state => state.currentSearch,
+    currentOrigin: state => state.currentOrigin,
   }),
   mounted: function(){
     const self = this;
     window.onpopstate = (event) => {
-      if (self.currentPath != document.location.pathname){
+      if (isNavigatingToAnotherPage({
+          origin: self.currentOrigin,
+          pathName: self.currentPathName,
+          search: self.currentSearch
+        }, document.location)){
         self.$store.dispatch("navigateTo", {url: document.location.pathname, backwards: true} );
       }
     }

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

@@ -0,0 +1,9 @@
+const isNavigatingToAnotherPage = function(currentLocation, targetLocation) {
+
+  // omits hash by design
+  return currentLocation.pathName !== targetLocation.pathname ||
+    currentLocation.origin !== targetLocation.origin ||
+    currentLocation.search !== targetLocation.search
+}
+
+export default isNavigatingToAnotherPage

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

@@ -8,14 +8,18 @@ Vue.use(Vuex)
 const store = new Vuex.Store({
   state: {
     pageTemplate: null,
-    currentPath: document.location.pathname
+    currentPathName: document.location.pathname,
+    currentSearch: document.location.search,
+    currentOrigin: document.location.origin
   },
   mutations: {
     setPageTemplate (state, serverResponse){
       state.pageTemplate = serverResponse
     },
-    setCurrentPath (state, path){
-      state.currentPath = path
+    setCurrentLocation (state, current){
+      state.currentPathName = current.path
+      state.currentSearch = current.search
+      state.currentOrigin = current.origin
     }
   },
   actions: {
@@ -46,7 +50,7 @@ const store = new Vuex.Store({
           setTimeout(function () {
             resolve(response["data"])
             commit('setPageTemplate', response["data"])
-            commit('setCurrentPath', url)
+            commit('setCurrentLocation', { path: url, search: document.location.search, origin: document.location.origin })
             matestackEventHub.$emit("page_loaded", url);
             if (typeof matestackUiCoreTransitionSuccess !== 'undefined') {
               matestackUiCoreTransitionSuccess(url);

spec/usage/components/transition_spec.rb

@@ -141,18 +141,20 @@ def page2
     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(page).to have_no_content(first_content_on_page_1)
 
-    expect(first_content_on_page_1).not_to eq(refreshed_content_on_page_1)
+    page.go_forward
+
+    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")
   end
 
   # supposed to work, but doesn't. Suspect Vue is the culprint here