Merge pull request #40 from BrowserSync/not_found_2

not found v2

crates/bsnext_core/src/handler_stack.rs

@@ -1,9 +1,10 @@
 use crate::handlers::proxy::{proxy_handler, ProxyConfig};
+use crate::not_found::not_found_service::{not_found_loader, not_found_srv};
 use crate::optional_layers::optional_layers;
 use crate::raw_loader::serve_raw_one;
 use crate::serve_dir::try_many_services_dir;
 use axum::handler::Handler;
-use axum::middleware::from_fn_with_state;
+use axum::middleware::{from_fn, from_fn_with_state};
 use axum::routing::{any, any_service, get_service, MethodRouter};
 use axum::{Extension, Router};
 use bsnext_input::route::{DirRoute, FallbackRoute, Opts, ProxyRoute, RawRoute, Route, RouteKind};
@@ -219,7 +220,9 @@ pub fn stack_to_router(path: &str, stack: HandlerStack) -> Router {
         }
         HandlerStack::Dirs(dirs) => {
             let service = serve_dir_layer(&dirs, Router::new());
-            Router::new().nest_service(path, service)
+            Router::new()
+                .nest_service(path, service)
+                .layer(from_fn(not_found_loader))
         }
         HandlerStack::Proxy { proxy, opts } => {
             let proxy_config = ProxyConfig {

examples/basic/fallback.yml

@@ -0,0 +1,5 @@
+servers:
+  - name: "fallback"
+    routes:
+      - path: /
+        dir: examples/basic/empty

package.json

@@ -38,7 +38,8 @@
     "universal": "napi universal",
     "version": "napi version",
     "tsc": "tsc",
-    "tsc:watch": "tsc --watch"
+    "tsc:watch": "tsc --watch",
+    "lint": "deno fmt tests"
   },
   "napi": {
     "name": "bslive",

tests/bslive-ui.spec.ts

@@ -1,15 +1,29 @@
-import {bstest, test} from './utils';
+import { bstest, test } from "./utils";
+import { expect } from "@playwright/test";
 
-test.describe('Browsersync bslive 404 UI', {
+test.describe("Browsersync bslive 404 UI", {
   annotation: {
     type: bstest({
-      input: 'examples/basic/headers.yml'
-    })
-  }
+      input: "examples/basic/headers.yml",
+    }),
+  },
 }, () => {
+  test("shows the UI", async ({ page, request, bs }) => {
+    await page.goto(bs.path("/__bslive"));
+    await page.locator("bs-header").waitFor({ timeout: 1000 });
+  });
+});
 
-  test('shows the UI', async ({page, request, bs}) => {
-    await page.goto(bs.path('/__bslive'));
-    await page.locator('bs-header').waitFor({timeout: 1000});
+test.describe("Browsersync bslive 404 fallback", {
+  annotation: {
+    type: bstest({
+      input: "examples/basic/fallback.yml",
+    }),
+  },
+}, () => {
+  test("shows the UI as fallback on DIR", async ({ page, bs }) => {
+    const r = await page.goto(bs.path("/"));
+    await page.locator("bs-header").waitFor({ timeout: 1000 });
+    expect(r?.status()).toEqual(404);
   });
-})
+});

tests/client.spec.ts

@@ -1,14 +1,13 @@
 import {bstest, test} from "./utils";
-import {expect} from "@playwright/test";
 
-test.describe('examples/basic/client.yml', {
+test.describe("examples/basic/client.yml", {
   annotation: {
     type: bstest({
-      input: 'examples/basic/client.yml'
+      input: "examples/basic/client.yml",
     }),
-    description: ''
-  }
+    description: "",
+  },
 }, () => {
-  test('configures log level', async ({request, bs}) => {
+  test("configures log level", async ({request, bs}) => {
   });
-})
+});

tests/delays.spec.ts

@@ -1,34 +1,34 @@
-import {bstest, test} from "./utils";
-import {expect} from "@playwright/test";
+import { bstest, test } from "./utils";
+import { expect } from "@playwright/test";
 
-test.describe('examples/basic/delays.yml', {
+test.describe("examples/basic/delays.yml", {
   annotation: {
     type: bstest({
-      input: 'examples/basic/delays.yml'
+      input: "examples/basic/delays.yml",
     }),
-    description: ''
-  }
+    description: "",
+  },
 }, () => {
-  test('first delay item', async ({request, bs}) => {
+  test("first delay item", async ({ request, bs }) => {
     const start = Date.now();
-    const response = await request.get(bs.path('/'));
+    const response = await request.get(bs.path("/"));
 
     const body = await response.body();
     const diff = Date.now() - start;
 
-    expect(body.toString()).toBe(`first - 200ms delay`)
-    expect(diff).toBeGreaterThan(200)
-    expect(diff).toBeLessThan(300)
+    expect(body.toString()).toBe(`first - 200ms delay`);
+    expect(diff).toBeGreaterThan(200);
+    expect(diff).toBeLessThan(300);
   });
-  test('500ms delay', async ({request, bs}) => {
+  test("500ms delay", async ({ request, bs }) => {
     const start = Date.now();
-    const response = await request.get(bs.path('/500'));
+    const response = await request.get(bs.path("/500"));
 
     const body = await response.body();
     const diff = Date.now() - start;
 
-    expect(body.toString()).toBe(`second - 500ms delay`)
-    expect(diff).toBeGreaterThan(500)
-    expect(diff).toBeLessThan(600)
+    expect(body.toString()).toBe(`second - 500ms delay`);
+    expect(diff).toBeGreaterThan(500);
+    expect(diff).toBeLessThan(600);
   });
-})
+});

tests/headers.spec.ts

@@ -1,17 +1,17 @@
-import {bstest, test} from "./utils";
-import {expect} from "@playwright/test";
+import { bstest, test } from "./utils";
+import { expect } from "@playwright/test";
 
-test.describe('examples/basic/headers.yml', {
+test.describe("examples/basic/headers.yml", {
   annotation: {
     type: bstest({
-      input: 'examples/basic/headers.yml'
+      input: "examples/basic/headers.yml",
     }),
-    description: ''
-  }
+    description: "",
+  },
 }, () => {
-  test('first item /', async ({request, bs}) => {
+  test("first item /", async ({ request, bs }) => {
     // Send a GET request to the base URL
-    const response = await request.get(bs.path('/'));
+    const response = await request.get(bs.path("/"));
 
     // Extract headers from the response
     const headers = response.headers();
@@ -20,20 +20,21 @@ test.describe('examples/basic/headers.yml', {
     const body = await response.body();
 
     // Assert that the content-type header is 'application/json'
-    expect(headers['content-type']).toBe('application/json')
+    expect(headers["content-type"]).toBe("application/json");
 
     // Assert that the body content is '[ 1, 2 ]'
-    expect(body.toString()).toBe(`[ 1, 2 ]`)
+    expect(body.toString()).toBe(`[ 1, 2 ]`);
   });
-  test('/other', async ({request, bs}) => {
-    const response = await request.get(bs.path('/other'));
+  test("/other", async ({ request, bs }) => {
+    const response = await request.get(bs.path("/other"));
     const headers = response.headers();
     const expected = {
-      'vary': 'origin, access-control-request-method, access-control-request-headers',
-      'access-control-allow-origin': 'localhost',
-      'access-control-expose-headers': '*',
-      abc: 'def',
-    }
-    expect(headers).toMatchObject(expected)
+      "vary":
+        "origin, access-control-request-method, access-control-request-headers",
+      "access-control-allow-origin": "localhost",
+      "access-control-expose-headers": "*",
+      abc: "def",
+    };
+    expect(headers).toMatchObject(expected);
   });
-})
+});

tests/inject.spec.ts

@@ -1,31 +1,31 @@
-import {bstest, test} from "./utils";
-import {expect} from "@playwright/test";
+import { bstest, test } from "./utils";
+import { expect } from "@playwright/test";
 
-test.describe('examples/basic/inject.yml', {
+test.describe("examples/basic/inject.yml", {
   annotation: {
     type: bstest({
-      input: 'examples/basic/inject.yml'
+      input: "examples/basic/inject.yml",
     }),
-    description: ''
-  }
+    description: "",
+  },
 }, () => {
-  test('inject bslive:connector', async ({request, bs}) => {
-    const response = await request.get(bs.path('/'), {
+  test("inject bslive:connector", async ({ request, bs }) => {
+    const response = await request.get(bs.path("/"), {
       headers: {
-        accept: 'text/html'
-      }
+        accept: "text/html",
+      },
     });
     const body = await response.body();
     expect(body.toString()).toMatchSnapshot();
 
     {
-      const response = await request.get(bs.path('/form.html'), {
+      const response = await request.get(bs.path("/form.html"), {
         headers: {
-          accept: 'text/html'
-        }
+          accept: "text/html",
+        },
       });
       const body = await response.body();
       expect(body.toString()).toMatchSnapshot();
     }
   });
-})
+});