From 894bb9b190266274d6cb4ce33bb286676726a495 Mon Sep 17 00:00:00 2001 From: David Catalan <40354404+catalan-adobe@users.noreply.github.com> Date: Mon, 23 Sep 2024 14:38:17 +0200 Subject: [PATCH] fix(sm-import): handle eds url domain (#431) --- js/import/import.ui.js | 13 +++-- .../import/sections-mapping.import.js | 53 +++---------------- js/sections-mapping/sm.ui.js | 10 ++-- js/sections-mapping/utils.js | 35 ++++++++++++ js/shared/utils.js | 4 +- 5 files changed, 53 insertions(+), 62 deletions(-) diff --git a/js/import/import.ui.js b/js/import/import.ui.js index 66f33ee4..ba751e93 100644 --- a/js/import/import.ui.js +++ b/js/import/import.ui.js @@ -29,9 +29,8 @@ import { import * as fragmentUI from '../sections-mapping/sm.ui.js'; import { buildTransformationRulesFromMapping } from './import.rules.js'; import TransformFactory from '../shared/transformfactory.js'; -import detectSections from '../sections-mapping/utils.js'; +import detectSections, { getFragmentSectionsMappingData } from '../sections-mapping/utils.js'; import { preparePagePreview } from '../express/free-mapping/preview-selectors.js'; -import { getFragmentSectionsMappingData } from '../sections-mapping/import/sections-mapping.import.js'; const PARENT_SELECTOR = '.import'; const CONFIG_PARENT_SELECTOR = `${PARENT_SELECTOR} form`; @@ -703,13 +702,13 @@ const attachListeners = () => { processNext(); } const saveMappingsForAssistant = async () => { - let sectionsMapping = getFragmentSectionsMappingData(url); - sectionsMapping = JSON.stringify(sectionsMapping, null, 2); - if (sectionsMapping) { + const sectionsData = getFragmentSectionsMappingData(url); + + if (sectionsData) { if (sessionStorage.getItem(DEMO_TOOL_MODE_SESSION_STORAGE_KEY)) { - await saveBlob(new Blob([sectionsMapping]), 'sections-mapping.json'); + await saveBlob(new Blob([JSON.stringify(sectionsData, null, 2)]), 'sections-mapping.json'); } else if (dirHandle) { - await saveFile(dirHandle, 'sections-mapping.json', sectionsMapping); + await saveFile(dirHandle, 'sections-mapping.json', JSON.stringify(sectionsData, null, 2)); } } }; diff --git a/js/sections-mapping/import/sections-mapping.import.js b/js/sections-mapping/import/sections-mapping.import.js index 0ed3bf72..d06ca16e 100644 --- a/js/sections-mapping/import/sections-mapping.import.js +++ b/js/sections-mapping/import/sections-mapping.import.js @@ -2,8 +2,8 @@ * GENERIC IMPORT SCRIPT FOR SECTIONS MAPPING DATA */ /* global WebImporter */ - import { getElementByXpath } from '../../shared/utils.js'; +import { generateDocumentPath, getFragmentSectionsMappingData } from '../utils.js'; import * as parsers from './parsers/parsers.js'; /** @@ -39,40 +39,6 @@ function getImgFromBackground(element, document, originalURL) { return null; } -export function generateDocumentPath({ url }) { - let p = new URL(url).pathname; - if (p.endsWith('/')) { - p = `${p}index`; - } - p = decodeURIComponent(p) - .toLowerCase() - .replace(/\.html$/, '') - .replace(/[^a-z0-9/]/gm, '-'); - return WebImporter.FileUtils.sanitizePath(p); -} - -export function getFragmentSectionsMappingData(url) { - const item = localStorage.getItem('helix-importer-sections-mapping'); - - if (item) { - const mData = JSON.parse(item); - - // return manual mapping first - let found = mData.find((m) => m.url === url && m.autoDetect === false); - if (found) { - return found.mapping; - } - - // return auto-detected mapping - found = mData.find((m) => m.url === url && m.autoDetect === true); - if (found) { - return found.mapping; - } - } - - return null; -} - /** * constants */ @@ -168,18 +134,20 @@ export default { * get sections mapping data */ - const mapping = getFragmentSectionsMappingData(params.originalURL); + const { mapping } = getFragmentSectionsMappingData(params.originalURL); if (!mapping) { throw new Error('No sections mapping data found, aborting'); } // get import target const target = sessionStorage.getItem('demo-tool-aem-importer-target') || IMPORT_TARGETS.AEM_BLOCK_COLLECTION; - const importedElements = mapping.map((m) => { + // sanitize path + const sanitizedPath = generateDocumentPath({ url: `http://domain.com${m.path}` }); + const importedEl = { element: null, - path: m.path, + path: sanitizedPath, report: {}, }; @@ -313,13 +281,4 @@ export default { return importedElements; }, - - /** - * Return a path that describes the document being transformed (file name, nesting...). - * The path is then used to create the corresponding Word document. - * @param {String} url The url of the document being transformed. - * @param {HTMLDocument} document The document - */ - generateDocumentPath, - }; diff --git a/js/sections-mapping/sm.ui.js b/js/sections-mapping/sm.ui.js index 4fb31f0e..6929d461 100644 --- a/js/sections-mapping/sm.ui.js +++ b/js/sections-mapping/sm.ui.js @@ -1,6 +1,7 @@ import alert from '../shared/alert.js'; import { getContentFrame } from '../shared/ui.js'; import { getElementByXpath } from '../shared/utils.js'; +import { generateDocumentPath } from './utils.js'; const ADD_FRAGMENT_BTN = document.getElementById('sm-add-fragment'); const SM_FRAGMENTS_CONTAINER = document.getElementById('sm-fragments-container'); @@ -89,6 +90,7 @@ export function getSMCache() { export function saveSMCache() { const url = importerConfig.fields['import-url']; + const sanitizedPath = generateDocumentPath({ url }); const autoDetect = importerConfig.fields['import-sm-auto-detect']; const cache = getSMCache(); const mapping = getSMData(); @@ -101,6 +103,7 @@ export function saveSMCache() { } else { cache.push({ url, + sanitizedPath, autoDetect, mapping, }); @@ -392,12 +395,7 @@ export function addBlockInSection(row, target) { */ function getMainFragmentPath(url) { - const u = new URL(url); - let mainPath = u.pathname.replace(/\.[^/.]+$/, ''); - if (mainPath === '/') { - mainPath = '/index'; - } - return mainPath; + return generateDocumentPath({ url }); } export function addFragmentAccordionElement(path) { diff --git a/js/sections-mapping/utils.js b/js/sections-mapping/utils.js index 839a3af4..f5881eed 100644 --- a/js/sections-mapping/utils.js +++ b/js/sections-mapping/utils.js @@ -1,3 +1,4 @@ +/* global WebImporter */ import * as fragmentUI from './sm.ui.js'; export default async function detectSections(src, frame, autoDetect) { @@ -52,3 +53,37 @@ export default async function detectSections(src, frame, autoDetect) { console.error(`Error loading sections mapping data for url ${originalURL}`, e); } } + +export function generateDocumentPath({ url }) { + let p = new URL(url).pathname; + if (p.endsWith('/')) { + p = `${p}index`; + } + p = decodeURIComponent(p) + .toLowerCase() + .replace(/\.html$/, '') + .replace(/[^a-z0-9/]/gm, '-'); + return WebImporter.FileUtils.sanitizePath(p); +} + +export function getFragmentSectionsMappingData(url) { + const item = localStorage.getItem('helix-importer-sections-mapping'); + + if (item) { + const mData = JSON.parse(item); + + // return manual mapping first + let found = mData.find((m) => m.url === url && m.autoDetect === false); + if (found) { + return found; + } + + // return auto-detected mapping + found = mData.find((m) => m.url === url && m.autoDetect === true); + if (found) { + return found; + } + } + + return null; +} diff --git a/js/shared/utils.js b/js/shared/utils.js index 1c6b393c..eab1bf84 100644 --- a/js/shared/utils.js +++ b/js/shared/utils.js @@ -13,7 +13,7 @@ import { getContentFrame, IS_EXPRESS, IS_FRAGMENTS } from './ui.js'; // eslint-disable-next-line import/no-cycle import { getFragmentSectionsMappingData, -} from '../sections-mapping/import/sections-mapping.import.js'; +} from '../sections-mapping/utils.js'; import { getFreeSelectionsMapping, } from '../express/free-mapping/free.mapping.utils.js'; @@ -113,7 +113,7 @@ const getXPath = (elm, document, withDetails = false) => { function getSectionsMappingData(url) { if (IS_FRAGMENTS) { - return getFragmentSectionsMappingData(url); + return getFragmentSectionsMappingData(url).mapping; } if (IS_EXPRESS) { return getFreeSelectionsMapping(url);