diff --git a/src/editors/sharedComponents/TinyMceWidget/hooks.js b/src/editors/sharedComponents/TinyMceWidget/hooks.js
index e97492e55..a2fe25717 100644
--- a/src/editors/sharedComponents/TinyMceWidget/hooks.js
+++ b/src/editors/sharedComponents/TinyMceWidget/hooks.js
@@ -12,7 +12,7 @@ import { StrictDict } from '../../utils';
import pluginConfig from './pluginConfig';
import * as module from './hooks';
import tinyMCE from '../../data/constants/tinyMCE';
-import { getRelativeUrl, getStaticUrl } from './utils';
+import { getRelativeUrl, getStaticUrl, parseAssetName } from './utils';
export const state = StrictDict({
// eslint-disable-next-line react-hooks/rules-of-hooks
@@ -89,9 +89,9 @@ export const replaceStaticWithAsset = ({
const isStatic = src.startsWith('/static/');
const assetSrc = src.substring(0, src.indexOf('"'));
const staticName = assetSrc.substring(8);
- const assetName = assetSrc.replace(/\/assets\/.+[^/]\//g, '');
+ const assetName = parseAssetName(src);
const displayName = isStatic ? staticName : assetName;
- const isCorrectAssetFormat = assetSrc.match(/\/asset-v1:\S+[+]\S+[@]\S+[+]\S+[@]/g)?.length >= 1;
+ const isCorrectAssetFormat = assetSrc.startsWith('/asset') && assetSrc.match(/\/asset-v1:\S+[+]\S+[@]\S+[+]\S+[@]/g)?.length >= 1;
// assets in expandable text areas so not support relative urls so all assets must have the lms
// endpoint prepended to the relative url
if (editorType === 'expandable') {
@@ -407,15 +407,7 @@ export const setAssetToStaticUrl = ({ editorValue, lmsEndpointUrl }) => {
const assetSrcs = typeof content === 'string' ? content.split(/(src="|src="|href="|href=")/g) : [];
assetSrcs.filter(src => src.startsWith('/asset')).forEach(src => {
- let nameFromEditorSrc;
- if (src.match(/\/asset-v1:\S+[+]\S+[@]\S+[+]\S+\/\w/)?.length >= 1) {
- const assetBlockName = src.substring(0, src.search(/("|")/));
- const dividedSrc = assetBlockName.split(/\/asset-v1:\S+[+]\S+[@]\S+[+]\S+\//);
- [, nameFromEditorSrc] = dividedSrc;
- } else {
- const assetBlockName = src.substring(src.indexOf('@') + 1, src.search(/("|")/));
- nameFromEditorSrc = assetBlockName.substring(assetBlockName.indexOf('@') + 1);
- }
+ const nameFromEditorSrc = parseAssetName(src);
const portableUrl = getStaticUrl({ displayName: nameFromEditorSrc });
const currentSrc = src.substring(0, src.search(/("|")/));
const updatedContent = content.replace(currentSrc, portableUrl);
diff --git a/src/editors/sharedComponents/TinyMceWidget/hooks.test.js b/src/editors/sharedComponents/TinyMceWidget/hooks.test.js
index 484a4b2fe..36f46515e 100644
--- a/src/editors/sharedComponents/TinyMceWidget/hooks.test.js
+++ b/src/editors/sharedComponents/TinyMceWidget/hooks.test.js
@@ -183,17 +183,17 @@ describe('TinyMceEditor hooks', () => {
});
describe('replaceStaticWithAsset', () => {
- const initialContent = `
test
`;
+ const initialContent = `
test
`;
const learningContextId = 'course-v1:org+test+run';
const lmsEndpointUrl = 'sOmEvaLue.cOm';
it('returns updated src for text editor to update content', () => {
- const expected = `
test
`;
+ const expected = `
test
`;
const actual = module.replaceStaticWithAsset({ initialContent, learningContextId });
expect(actual).toEqual(expected);
});
it('returns updated src with absolute url for expandable editor to update content', () => {
const editorType = 'expandable';
- const expected = `
test
`;
+ const expected = `
test
`;
const actual = module.replaceStaticWithAsset({
initialContent,
editorType,
diff --git a/src/editors/sharedComponents/TinyMceWidget/utils.js b/src/editors/sharedComponents/TinyMceWidget/utils.js
index b6e56c655..a7b1fc001 100644
--- a/src/editors/sharedComponents/TinyMceWidget/utils.js
+++ b/src/editors/sharedComponents/TinyMceWidget/utils.js
@@ -13,3 +13,16 @@ export const getRelativeUrl = ({ courseId, displayName }) => {
}
return '';
};
+
+export const parseAssetName = (relativeUrl) => {
+ let assetName = '';
+ if (relativeUrl.match(/\/asset-v1:\S+[+]\S+[@]\S+[+]\S+\/\w/)?.length >= 1) {
+ const assetBlockName = relativeUrl.substring(0, relativeUrl.search(/("|")/));
+ const dividedSrc = assetBlockName.split(/\/asset-v1:\S+[+]\S+[@]\S+[+]\S+\//);
+ [, assetName] = dividedSrc;
+ } else {
+ const assetBlockName = relativeUrl.substring(relativeUrl.indexOf('@') + 1, relativeUrl.search(/("|")/));
+ assetName = assetBlockName.substring(assetBlockName.indexOf('@') + 1);
+ }
+ return assetName;
+};