Only relative-ize the URLs when they match. The backend config should be able to dictate this, but the front end will adjust it.

Signed-off-by: Aramis Sennyey <sennyeya@amazon.com>

packages/core-app-api/src/app/AppManager.test.tsx

@@ -619,34 +619,29 @@ describe('Integration Test', () => {
       {
         data: {
           backend: {
-            baseUrl: '/',
+            baseUrl: 'http://localhost:8008/',
           },
-        },
-        paths: ['backend.baseUrl'],
-      },
-      {
-        data: {
           app: {
-            baseUrl: '/',
+            baseUrl: 'http://localhost:8008/',
           },
         },
-        paths: ['app.baseUrl'],
+        paths: ['app.baseUrl', 'backend.baseUrl'],
       },
       {
         data: {
           backend: {
-            baseUrl: '/',
+            baseUrl: 'http://test.com/',
           },
           app: {
-            baseUrl: '/',
+            baseUrl: 'http://test.com/',
           },
         },
         paths: ['app.baseUrl', 'backend.baseUrl'],
       },
     ].forEach(item => {
       item.paths.forEach(path => {
-        it('should add the fully qualified origin when the relevant urls are relative', async () => {
-          await checkConfigValue(item.data, path, 'http://localhost');
+        it('should force the urls to be relative when they are the same', async () => {
+          await checkConfigValue(item.data, path, 'http://localhost/');
         });
       });
     });
@@ -654,19 +649,45 @@ describe('Integration Test', () => {
       {
         data: {
           backend: {
-            baseUrl: 'https://google.com',
+            baseUrl: 'http://test.com/backstage',
+          },
+          app: {
+            baseUrl: 'http://test.com/backstage',
           },
         },
-        paths: ['backend.baseUrl'],
+        paths: ['app.baseUrl', 'backend.baseUrl'],
       },
+    ].forEach(item => {
+      item.paths.forEach(path => {
+        it('should force the urls to be relative when they are the same AND keep path values', async () => {
+          await checkConfigValue(item.data, path, 'http://localhost/backstage');
+        });
+      });
+    });
+    [
       {
         data: {
+          backend: {
+            baseUrl: 'http://test.com/backstage/my-instance',
+          },
           app: {
-            baseUrl: 'https://bing.com',
+            baseUrl: 'http://test.com/backstage/my-instance',
           },
         },
-        paths: ['app.baseUrl'],
+        paths: ['app.baseUrl', 'backend.baseUrl'],
       },
+    ].forEach(item => {
+      item.paths.forEach(path => {
+        it('should force the urls to be relative when they are the same AND keep nested path values', async () => {
+          await checkConfigValue(
+            item.data,
+            path,
+            'http://localhost/backstage/my-instance',
+          );
+        });
+      });
+    });
+    [
       {
         data: {
           backend: {

packages/core-app-api/src/app/AppManager.tsx

@@ -156,35 +156,42 @@ function useConfigLoader(
 
   let configReader = ConfigReader.fromConfigs(config.value ?? []);
 
-  const resolveRelativeUrl = (relativeUrl: string) => {
-    // relativeUrl should always be defined.
-    let url;
-    try {
-      url = new URL(relativeUrl, document.location.origin).href.replace(
-        /\/$/,
-        '',
-      );
-    } catch (err) {
-      // relativeUrl was not a valid URL. This should be caught during the build process.
-    }
-    return url;
+  const resolveRelativeUrl = (relativeUrl: string) =>
+    new URL(relativeUrl, document.location.origin).href;
+
+  const getRelativeUrl = (fullUrl: string) => {
+    const url = new URL(fullUrl);
+    return fullUrl.replace(url.origin, '');
   };
 
-  config.value?.push({
-    data: {
-      app: {
-        baseUrl: resolveRelativeUrl(
-          configReader.getOptionalString('app.baseUrl') || '/',
-        ),
+  /**
+   * We only want to override the URLs with the document origin when the URLs match
+   *  and are defined. We use getOptionalString here to not throw when the app.baseUrl
+   *  and backend.baseUrl are not defined. If they are defined but not well formatted URLs
+   *  the above resolveRelativeUrl() method will throw.
+   */
+  if (
+    configReader.getOptionalString('app.baseUrl') &&
+    configReader.getOptionalString('backend.baseUrl') &&
+    configReader.getOptionalString('app.baseUrl') ===
+      configReader.getOptionalString('backend.baseUrl')
+  ) {
+    config.value?.push({
+      data: {
+        app: {
+          baseUrl: resolveRelativeUrl(
+            getRelativeUrl(configReader.getString('app.baseUrl')),
+          ),
+        },
+        backend: {
+          baseUrl: resolveRelativeUrl(
+            getRelativeUrl(configReader.getString('backend.baseUrl')),
+          ),
+        },
       },
-      backend: {
-        baseUrl: resolveRelativeUrl(
-          configReader.getOptionalString('backend.baseUrl') || '/',
-        ),
-      },
-    },
-    context: 'relative-resolver',
-  });
+      context: 'relative-resolver',
+    });
+  }
 
   configReader = ConfigReader.fromConfigs(config.value ?? []);