feat(404): return 404 on unavailable amp pages (#80)

feat(404): return 404 on unavailable amp pages

Author: farnabaz

example/pages/noamp.vue

@@ -0,0 +1,11 @@
+<template>
+  <div>
+    No to AMP
+  </div>
+</template>
+
+<script>
+export default {
+  amp: false
+}
+</script>

lib/amp/plugin.js

@@ -23,12 +23,13 @@ export default function (ctx, inject) {
   if (!route.matched[0]) {
     return
   }
-
+  const hasAMPPrefix = route.path === '/amp' || route.path.indexOf('/amp/') === 0
   const { options } = route.matched[0].components.default
+  const metaAMP = Array.isArray(route.meta) ? route.meta[0].amp : route.meta.amp
 
   let ampMode = pick(
     options.amp,
-    route.meta.amp,
+    metaAMP,
     '<%= options.mode %>'
   )
 
@@ -41,7 +42,7 @@ export default function (ctx, inject) {
       ampMode = 'only'
       break
     case 'hybrid':
-      isAMP = route.path === '/amp' || route.path.indexOf('/amp/') === 0
+      isAMP = hasAMPPrefix
       ampMode = 'hybrid'
       break
     case false:
@@ -62,6 +63,10 @@ export default function (ctx, inject) {
   inject('isAMP', isAMP)
   inject('ampMode', ampMode)
 
+  if (!isAMP && hasAMPPrefix) {
+    ctx.error({ statusCode: 404, message: 'This page could not be found' })
+  }
+
   if (ampMode !== false && !options._amp) {
     options.head = createCustomHead(options.head)
     options.layout = createCustomLayout(options.layout, options.ampLayout)

test/module.test.js

@@ -146,3 +146,13 @@ describe('Render AMP Story', () => {
     expect(await isValid(source)).toEqual(true)
   })
 })
+
+describe('Render disabled amp page', () => {
+  beforeAll(async () => {
+    await page.goto(url('/amp/noamp'))
+  })
+
+  test('404 for not amp pages', async () => {
+    await expect(page).toMatch('This page could not be found')
+  })
+})