fix display of correct url on redirected links

Bemoth · Oct 11, 2018 · a1f78f1 · a1f78f1
1 parent 0044870
commit a1f78f1
Show file tree

Hide file tree

Showing 8 changed files with 66 additions and 26 deletions.
diff --git a/dist/swup.js b/dist/swup.js
@@ -555,7 +555,7 @@ var Swup = function () {
                                 return;
                             } else {
                                 // get json data
-                                var page = _this2.getDataFromHtml(response);
+                                var page = _this2.getDataFromHtml(response, request);
                                 if (page != null) {
                                     page.url = link.getAddress();
                                     _this2.cache.cacheUrl(page, _this2.options.debugMode);
@@ -929,7 +929,7 @@ module.exports = function (options) {
 "use strict";
 
 
-module.exports = function (html) {
+module.exports = function (html, request) {
     var _this = this;
 
     var content = html.replace('<body', '<div id="swupBody"').replace('</body>', '</div>');
@@ -953,7 +953,8 @@ module.exports = function (html) {
         title: fakeDom.querySelector('title').innerText,
         pageClass: fakeDom.querySelector('#swupBody').className,
         originalContent: html,
-        blocks: blocks
+        blocks: blocks,
+        responseURL: request != null ? request.responseURL : window.location.href
     };
     return json;
 };
@@ -1034,7 +1035,7 @@ module.exports = function (data, popstate) {
                         return;
                     } else {
                         // get json data
-                        var page = _this.getDataFromHtml(response);
+                        var page = _this.getDataFromHtml(response, request);
                         if (page != null) {
                             page.url = data.url;
                         } else {
@@ -1076,6 +1077,12 @@ module.exports = function (data, popstate) {
 "use strict";
 
 
+var _Link = __webpack_require__(0);
+
+var _Link2 = _interopRequireDefault(_Link);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 var forEach = Array.prototype.forEach;
 
 
@@ -1084,6 +1091,18 @@ module.exports = function (page, popstate) {
 
     document.documentElement.classList.remove('is-leaving');
 
+    // replace state in case the url was redirected
+    var link = new _Link2.default();
+    link.setPath(page.responseURL);
+
+    if (window.location.pathname !== link.getPath()) {
+        window.history.replaceState({
+            url: link.getPath(),
+            random: Math.random(),
+            source: "swup"
+        }, document.title, link.getPath());
+    }
+
     // only add for non-popstate transitions
     if (!popstate || this.options.animateHistoryBrowsing) {
         document.documentElement.classList.add('is-rendering');
@@ -1416,24 +1435,26 @@ var _Link2 = _interopRequireDefault(_Link);
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-module.exports = function (eventName) {
+module.exports = function () {
     var _this = this;
 
     if (this.options.preload) {
         var preload = function preload(pathname) {
             var link = new _Link2.default();
             link.setPath(pathname);
             if (link.getAddress() != _this.currentUrl && !_this.cache.exists(link.getAddress()) && _this.preloadPromise == null) {
-                _this.getPage({ url: link.getAddress() }, function (response) {
-                    if (response === null) {
-                        console.warn('Server error.');
+                _this.getPage({ url: link.getAddress() }, function (response, request) {
+                    if (request.status === 500) {
                         _this.triggerEvent('serverError');
+                        return;
                     } else {
                         // get json data
-                        var page = _this.getDataFromHtml(response);
-                        page.url = link.getAddress();
-                        _this.cache.cacheUrl(page, _this.options.debugMode);
-                        _this.triggerEvent('pagePreloaded');
+                        var page = _this.getDataFromHtml(response, request);
+                        if (page != null) {
+                            page.url = link.getAddress();
+                            _this.cache.cacheUrl(page, _this.options.debugMode);
+                            _this.triggerEvent('pagePreloaded');
+                        }
                     }
                 });
             }

diff --git a/dist/swup.min.js b/dist/swup.min.js
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "swup",
-  "version": "1.3.3",
+  "version": "1.4.0",
   "description": "Animated page transitions with css.",
   "main": "lib/index.js",
   "scripts": {

diff --git a/src/index.js b/src/index.js
@@ -302,7 +302,7 @@ export default class Swup {
                             return;
                         } else {
                             // get json data
-                            var page = this.getDataFromHtml(response)
+                            var page = this.getDataFromHtml(response, request)
                             if (page != null) {
                                 page.url = link.getAddress()
                                 this.cache.cacheUrl(page, this.options.debugMode)

diff --git a/src/modules/getDataFromHtml.js b/src/modules/getDataFromHtml.js
@@ -1,4 +1,4 @@
-module.exports = function (html) {
+module.exports = function (html, request) {
     let content = html.replace('<body', '<div id="swupBody"').replace('</body>', '</div>')
     let fakeDom = document.createElement('div')
     fakeDom.innerHTML = content
@@ -20,7 +20,8 @@ module.exports = function (html) {
         title: fakeDom.querySelector('title').innerText,
         pageClass:  fakeDom.querySelector('#swupBody').className,
         originalContent: html,
-        blocks: blocks
+        blocks: blocks,
+        responseURL: request != null ? request.responseURL : window.location.href,
     }
     return json;
 }
diff --git a/src/modules/loadPage.js b/src/modules/loadPage.js
@@ -68,7 +68,7 @@ module.exports = function (data, popstate) {
                         return;
                     } else {
                         // get json data
-                        var page = this.getDataFromHtml(response)
+                        var page = this.getDataFromHtml(response, request)
                         if (page != null) {
                             page.url = data.url
                         } else {

diff --git a/src/modules/preloadPages.js b/src/modules/preloadPages.js
@@ -1,21 +1,23 @@
 import Link from '../Link'
 
-module.exports = function (eventName) {
+module.exports = function () {
     if (this.options.preload) {
         const preload = pathname => {
             var link = new Link()
             link.setPath(pathname)
             if (link.getAddress() != this.currentUrl && !this.cache.exists(link.getAddress()) && this.preloadPromise == null) {
-                this.getPage({ url: link.getAddress() }, response => {
-                    if (response === null) {
-                        console.warn('Server error.')
+                this.getPage({ url: link.getAddress() }, (response, request) => {
+                    if (request.status === 500) {
                         this.triggerEvent('serverError')
+                        return;
                     } else {
                         // get json data
-                        var page = this.getDataFromHtml(response)
-                        page.url = link.getAddress()
-                        this.cache.cacheUrl(page, this.options.debugMode)
-                        this.triggerEvent('pagePreloaded')
+                        var page = this.getDataFromHtml(response, request)
+                        if (page != null) {
+                            page.url = link.getAddress()
+                            this.cache.cacheUrl(page, this.options.debugMode)
+                            this.triggerEvent('pagePreloaded')
+                        }
                     }
                 })
             }

diff --git a/src/modules/renderPage.js b/src/modules/renderPage.js
@@ -1,8 +1,24 @@
 const { forEach } = Array.prototype;
+import Link from '../Link';
 
 module.exports = function (page, popstate) {
     document.documentElement.classList.remove('is-leaving')
 
+    // replace state in case the url was redirected
+    let link = new Link()
+    link.setPath(page.responseURL)
+
+    if (window.location.pathname !== link.getPath()) {
+        window.history.replaceState({
+                url: link.getPath(),
+                random: Math.random(),
+                source: "swup",
+            },
+            document.title,
+            link.getPath(),
+        );
+    }
+
     // only add for non-popstate transitions
     if (!popstate || this.options.animateHistoryBrowsing) {
         document.documentElement.classList.add('is-rendering')