diff --git a/plugins/techdocs/src/reader/transformers/addBaseUrl.test.ts b/plugins/techdocs/src/reader/transformers/addBaseUrl.test.ts index b9cf9745ee..4b1477e9c0 100644 --- a/plugins/techdocs/src/reader/transformers/addBaseUrl.test.ts +++ b/plugins/techdocs/src/reader/transformers/addBaseUrl.test.ts @@ -62,7 +62,7 @@ describe('addBaseUrl', () => { ]); }); - it('includes path option', () => { + it('includes path option without slash', () => { const shadowDom = createTestShadowDom(FIXTURES.FIXTURE_STANDARD_PAGE, { transformers: [ addBaseUrl({ @@ -86,4 +86,29 @@ describe('addBaseUrl', () => { 'https://example-host.storage.googleapis.com/example-docs/examplepath/assets/javascripts/vendor.d710d30a.min.js', ]); }); + + it('includes path option with slash', () => { + const shadowDom = createTestShadowDom(FIXTURES.FIXTURE_STANDARD_PAGE, { + transformers: [ + addBaseUrl({ + docStorageURL: DOC_STORAGE_URL, + componentId: 'example-docs', + path: 'examplepath/', + }), + ], + }); + + expect(getSample(shadowDom, 'img', 'src')).toEqual([ + 'https://example-host.storage.googleapis.com/example-docs/examplepath/img/win-py-install.png', + 'https://example-host.storage.googleapis.com/example-docs/examplepath/img/initial-layout.png', + ]); + expect(getSample(shadowDom, 'link', 'href')).toEqual([ + 'https://www.mkdocs.org/', + 'https://example-host.storage.googleapis.com/example-docs/examplepath/assets/images/favicon.png', + ]); + expect(getSample(shadowDom, 'script', 'src')).toEqual([ + 'https://www.google-analytics.com/analytics.js', + 'https://example-host.storage.googleapis.com/example-docs/examplepath/assets/javascripts/vendor.d710d30a.min.js', + ]); + }); }); diff --git a/plugins/techdocs/src/reader/transformers/addBaseUrl.ts b/plugins/techdocs/src/reader/transformers/addBaseUrl.ts index dc041e9a71..91986db729 100644 --- a/plugins/techdocs/src/reader/transformers/addBaseUrl.ts +++ b/plugins/techdocs/src/reader/transformers/addBaseUrl.ts @@ -37,8 +37,11 @@ export const addBaseUrl = ({ .filter(elem => !!elem.getAttribute(attributeName)) .forEach((elem: T) => { const urlFormatter = new URLFormatter( - `${docStorageURL}/${componentId}/${path}`, + path.length < 1 || path.endsWith('/') + ? `${docStorageURL}/${componentId}/${path}` + : `${docStorageURL}/${componentId}/${path}/`, ); + elem.setAttribute( attributeName, urlFormatter.formatURL(elem.getAttribute(attributeName)!),