feat: fix and use interpretPath

fibbojs · Dec 17, 2024 · a7bc998 · a7bc998
1 parent d7ec47f
commit a7bc998
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 41 deletions.
diff --git a/packages/2d/src/sprite/FSprite.ts b/packages/2d/src/sprite/FSprite.ts
@@ -1,4 +1,5 @@
 import * as PIXI from 'pixi.js'
+import { FAssetUtil } from '@fibbojs/util'
 import type { FComponentOptions } from '../core/FComponent'
 import { FComponent } from '../core/FComponent'
 import type { FScene } from '../core/FScene'
@@ -49,24 +50,8 @@ export class FSprite extends FComponent {
    * @param texture The path to the texture.
    */
   async loadTexture(texture: string) {
-    // Interpret path function
-    function interpretPath(path: string) {
-      // Resource URL (if it starts http, treat as a URL)
-      if (path.startsWith('http')) {
-        return path
-      }
-      // Absolute path (if it starts with /), add the current domain + path
-      else if (path.startsWith('/')) {
-        return `${window.location.href}${path}`
-      }
-      // Otherwise, treat as a relative path starting to the assets folder
-      else {
-        return `${window.location.href}/assets/${path}`
-      }
-    }
-
     // Interpret the path
-    const path = interpretPath(texture)
+    const path = FAssetUtil.interpretPath(texture)
     // Load the texture
     this.__TEXTURE__ = await PIXI.Assets.load(path)
     this.__TEXTURE__.source.scaleMode = 'nearest'

diff --git a/packages/3d/src/model/FModel.ts b/packages/3d/src/model/FModel.ts
@@ -1,4 +1,5 @@
 import * as THREE from 'three'
+import { FAssetUtil } from '@fibbojs/util'
 import type { FScene } from '../core/FScene'
 import { FComponent } from '../core/FComponent'
 import type { FComponentOptions } from '../core/FComponent'
@@ -71,28 +72,12 @@ export abstract class FModel extends FComponent {
     this.textures = options.textures
     this.fileExtension = options.fileExtension
 
-    // Interpret path function
-    function interpretPath(path: string) {
-      // Resource URL (if it starts http, treat as a URL)
-      if (path.startsWith('http')) {
-        return path
-      }
-      // Absolute path (if it starts with /), add the current domain + path
-      else if (path.startsWith('/')) {
-        return `${window.location.href}${path}`
-      }
-      // Otherwise, treat as a relative path starting to the assets folder
-      else {
-        return `${window.location.href}/assets/${path}`
-      }
-    }
-
     // Interpret the path
-    this.path = interpretPath(this.path)
+    this.path = FAssetUtil.interpretPath(this.path)
     // Interpret the textures
     this.textures = Object.fromEntries(
       Object.entries(this.textures).map(([materialName, texturePath]) => {
-        return [materialName, interpretPath(texturePath)]
+        return [materialName, FAssetUtil.interpretPath(texturePath)]
       }),
     )
   }

diff --git a/packages/util/src/FAssetUtil.ts b/packages/util/src/FAssetUtil.ts
@@ -20,17 +20,17 @@ export class FAssetUtil {
    * @returns The interpreted path.
    */
   static interpretPath(path: string) {
-    // Resource URL (if it starts http, treat as a URL)
+    // Resource URL (if it starts with http, treat as a URL)
     if (path.startsWith('http')) {
       return path
     }
-    // Absolute path (if it starts with /), add the current domain + path
+    // Absolute path (if it starts with /), add the current origin + path
     else if (path.startsWith('/')) {
-      return `${window.location.origin}${path}`
+      return `${window.location.href}${path}`
     }
     // Otherwise, treat as a relative path starting to the assets folder
     else {
-      return `${window.location.origin}/${FAssetUtil.__ASSETS_PATH__}/${path}`
+      return `${window.location.href}/${FAssetUtil.__ASSETS_PATH__}/${path}`
     }
   }
 }
diff --git a/packages/util/test/browser/asset.test.ts b/packages/util/test/browser/asset.test.ts
@@ -4,7 +4,8 @@ import { FAssetUtil } from '../../src'
 describe('@fibbojs/util/FAssetUtil should', () => {
   it('interprete a given path', () => {
     expect(FAssetUtil.interpretPath('http://localhost:5173/custom/my-asset.png')).toEqual('http://localhost:5173/custom/my-asset.png')
-    expect(FAssetUtil.interpretPath('/my-asset.png')).toEqual('http://localhost:5173/my-asset.png')
-    expect(FAssetUtil.interpretPath('my-asset.png')).toEqual('http://localhost:5173/assets/my-asset.png')
+    // for href based tests, the url isn't predictable as vitest will create a random id for the test, so we use regex to match the url
+    expect(FAssetUtil.interpretPath('/my-asset.png')).toMatch(/http:\/\/localhost:5173\/.*\/my-asset.png/)
+    expect(FAssetUtil.interpretPath('my-asset.png')).toMatch(/http:\/\/localhost:5173\/.*\/assets\/my-asset.png/)
   })
 })