update names, remove extra comments, add documentation

Author: raclim

client/modules/IDE/components/Header/resolveUtils.unit.test.jsx

@@ -1,6 +1,6 @@
 // resolveUtils.unit.test.jsx
 
-import resolvePathsForElementsWithAttribute from '../../../../../shared_file/resolveUtils';
+import resolvePathsForElementsWithAttribute from '../../../../../common_utils/resolveUtils';
 import { resolvePathToFile } from '../../../../../server/utils/filePath';
 
 // Mock the dependencies

client/modules/Preview/EmbedFrame.jsx

@@ -17,7 +17,7 @@ import {
 import { getAllScriptOffsets } from '../../utils/consoleUtils';
 import { registerFrame } from '../../utils/dispatcher';
 import { createBlobUrl } from './filesReducer';
-import resolvePathsForElementsWithAttribute from '../../../shared_file/resolveUtils';
+import resolvePathsForElementsWithAttribute from '../../../common_utils/resolveUtils';
 
 let objectUrls = {};
 let objectPaths = {};
@@ -205,12 +205,7 @@ function injectLocalFiles(files, htmlFile, options) {
   base.href = `${window.origin}${basePath}${basePath.length > 1 && '/'}`;
   sketchDoc.head.appendChild(base);
 
-  // Resolve paths for elements with the 'src' attribute
-  // This updates the 'src' attribute of elements (e.g., <img>, <script>) to their resolved URLs
   resolvePathsForElementsWithAttribute('src', sketchDoc, resolvedFiles);
-
-  // Resolve paths for elements with the 'href' attribute
-  // This updates the 'href' attribute of elements (e.g., <a>, <link>) to their resolved URLs
   resolvePathsForElementsWithAttribute('href', sketchDoc, resolvedFiles);
   // should also include background, data, poster, but these are used way less often
 

common_utils/resolveUtils.js

@@ -0,0 +1,32 @@
+import { resolvePathToFile } from '../server/utils/filePath';
+import { MEDIA_FILE_REGEX } from '../server/utils/fileUtils';
+
+/**
+ * Resolves paths for elements with a specific attribute.
+ *
+ * @param {string} attr - The attribute name to search for in elements, such as "src" or "href".
+ * @param {Document} sketchDoc - The document to search for elements with the attribute.
+ * @param {Array} files - The files to search for the resolved paths.
+ */
+
+export default function resolvePathsForElementsWithAttribute(
+  attr,
+  sketchDoc,
+  files
+) {
+  const elements = sketchDoc.querySelectorAll(`[${attr}]`);
+
+  const elementsArray = Array.prototype.slice.call(elements);
+
+  elementsArray.forEach((element) => {
+    const attrValue = element.getAttribute(attr);
+
+    if (MEDIA_FILE_REGEX.test(attrValue)) {
+      const resolvedFile = resolvePathToFile(attrValue, files);
+
+      if (resolvedFile && resolvedFile.url) {
+        element.setAttribute(attr, resolvedFile.url);
+      }
+    }
+  });
+}

server/utils/previewGeneration.js

@@ -1,5 +1,5 @@
 import { resolvePathToFile } from '../utils/filePath';
-import { resolvePathsForElementsWithAttribute } from '../../shared_file/resolveUtils';
+import { resolvePathsForElementsWithAttribute } from '../../common_utils/resolveUtils';
 
 import {
   STRING_REGEX,
@@ -44,7 +44,6 @@ export function injectMediaUrls(filesToInject, allFiles, projectId) {
   });
 }
 
-// Wrapped the function in a proper call
 export function resolveMediaElements(sketchDoc, files) {
   resolvePathsForElementsWithAttribute('src', sketchDoc, files);
 }