elegantthemes / Divi-Beta

8 stars 0 forks source link

Decoding HTML in Code Fields From D4 to D5 #107

Open dtcblyth opened 3 weeks ago

dtcblyth commented 3 weeks ago

Related Thread: https://discord.com/channels/1041765492907589683/1294162538497314967

The Problem:

It seems that Divi is converting target attributes to data-et-target-link when converting code field content from D4 to D5. See screen shots attached.

This is the original D4 content in the code field:

<a target="_blank">Hello World</a>
<div target="_blank">Hello World</div>
<cell target="_blank">Hello World</cell>

This is how it converts to D5:

<a data-et-target-link="_blank">Hello World</a>
<div data-et-target-link="_blank">Hello World</div>
<cell data-et-target-link="_blank">Hello World</cell>

Please note, this is a code field in a third-party module, not the Code module. The problem does not seem to occur with the Code module.

Here’s the field definition:

<FieldContainer
  label={__('Col: Rows', 'dvmd-table-maker')}
  attrName="colContent.innerContent"
  subName="text"
  defaultAttr={defaultAttrs?.colContent?.innerContent}
  description={fieldDescriptions?.colContent}
  features={{
    responsive: false,
    hover: false,
    sticky: false
  }}
>
  <CodeContainer 
    mode="html" 
  />
</FieldContainer>

And here’s the conversion outline:

const { replaceLineBreakPlaceholder } = window?.divi?.module;

export const conversionOutline = {
  advanced: {
    ...
  },
  css: {
    ...
  },
  module: {
    ...
    col_content: 'colContent.innerContent.*.text',
    ...
  },
  valueExpansionFunctionMap: {
    col_content: replaceLineBreakPlaceholder,
  },
}

I’m not sure if other attributes are being similarly affected... this is the only one I have noticed, so far.

D4 D5