Merge branch 'fix-2964' (PR OnsenUI#3014)

Fixes OnsenUI#2964.
nagyistoce · Sep 22, 2022 · 66811fe · 66811fe
2 parents 42669ca + b45e239
commit 66811fe
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 4 deletions.
diff --git a/onsenui/esm/elements/ons-navigator.js b/onsenui/esm/elements/ons-navigator.js
@@ -619,13 +619,13 @@ export default class NavigatorElement extends BaseElement {
       }));
     }
 
-    return this._pushPage(options, () => new Promise(resolve => {
+    return this._pushPage(options, () => new Promise((resolve, reject) => {
       this._pageLoader.load({page, parent: this, params: options.data}, pageElement => {
         prepare(pageElement);
         resolve();
       }, error => {
         this._isRunning = false;
-        throw error;
+        reject(error);
       });
     }));
   }

diff --git a/onsenui/esm/elements/ons-navigator.spec.js b/onsenui/esm/elements/ons-navigator.spec.js
@@ -79,6 +79,13 @@ describe('OnsNavigatorElement', () => {
       });
     });
 
+    it('push none exist page', (done) => {
+      nav.pushPage('404').catch(err => {
+        expect(err).to.equal(404);
+        done();
+      });
+    });
+
     it('adds a new page to the top of the page stack using options.pageHTML', (done) => {
       nav.pushPage(null, {
         pageHTML: '<ons-page>hoge2</ons-page>',

diff --git a/onsenui/esm/ons/internal/internal.js b/onsenui/esm/ons/internal/internal.js
@@ -123,7 +123,11 @@ internal.getTemplateHTMLAsync = function(page) {
       xhr.onload = function() {
         const html = xhr.responseText;
         if (xhr.status >= 400 && xhr.status < 600) {
-          reject(html);
+          if (xhr.status === 404) {
+            reject(404);
+          } else {
+            reject(html);
+          }
         } else {
           // Refresh script tags
           const fragment = util.createFragment(html);

diff --git a/onsenui/examples/navigator/index.html b/onsenui/examples/navigator/index.html
@@ -30,6 +30,15 @@
       myNavigator.pushPage('page1.html', {data: {title: myNavigator.topPage.querySelector('ons-input').value}})
     };
 
+    var push404Page = function() {
+      myNavigator.pushPage('page404.html')
+        .catch(err => {
+          if (err === 404) {
+            alert('Page not found');
+          }
+        });
+    };
+
   </script>
 
 </head>
@@ -69,7 +78,11 @@ <h1>Custom Page</h1>
         <ons-button
           onclick="customPush()">
           Push Page
-          </ons-button>
+        </ons-button>
+        <ons-button
+          onclick="push404Page()">
+          Push 404-Page
+        </ons-button>
 
         <ons-button
           onclick="myNavigator.popPage()">