WYSIWYG editor stripping out html

[fosterc1]

The WYSIWYG editor appears to be stripping out HTML added within text boxes.

FW: v5.42.1 / AT: v0.11.5

When entering html text within the Source of the WYSIWYG editor and then saving the HTML code is being removed.

As an example, we've added the following in the Body text in Project settings and within a text component:
<p>Welcome!We are committed to creating an environment where equity, diversity and inclusion (ED&amp;I) are non-negotiable, allowing our unique and authentic team members to bring their whole selves to work and feel a real sense of belonging. We’re on an ED&amp;I journey, and this learning experience is just the start.</p><p>Throughout this experience, you’ll have opportunities to reflect on what ED&amp;I means for you. When prompted, add your thoughts to your personal diary in the top right of the screen using the<span class="icon icon-checklist inline-icon" aria-hidden="true"></span>icon. You’ll be asked to share some of your thoughts and learning with your line manager or team leader at your next catch-up with them.</p>

After saving the editor stips out the HTML <span class="icon icon-checklist inline-icon" aria-hidden="true"></span>

We have tried selecting Source adding the text and saving and selecting Source adding the text, selecting Source again and saving, nothing seems to be preserving the HTML code.

[oliverfoster]

This is an authoring tool issue, moving.

[oliverfoster]

~~There is no html in the example you've given @fosterc1 could you be more specific please.~~ Have wrapped the example in appropriate tags.

[oliverfoster]

@simondate are you able to add and edit the same html in your aats?

[simondate]

None of my customers have mentioned any issues.

Looking at Caleb's code, I wonder if the aria-hidden is the thing that is being backlisted?

[StuartNicholls]

It looks as though the WYSIWYG is stripping out empty tags, so the example above gets removed for that reason. Adding something inside the tag helps, but as @simondate mentioned it looks like aria-hidden is ALSO blacklisted as that gets removed even with something inside the <span> tag.

@taylortom has something changed in the last few months as the editor didn't quite have this issue previously?

[ambivalent-axiom]

This is specifically in Authoring tool, CKEditor has its security settings and strips most of the HTML unless You define otherwise in config. nano [path to...]/adapt_authoring/conf/config.json find and edit: Example:

    "allow": [
      {
        "name": "^(blockquote|ul|ol|span|audio|source|button|div|script|iframe)$"
      },
      {
        "name": ".*",
        "classes": true,
        "styles": true
      },
      {
        "name": "^iframe$",
        "attributes": {
          "src": true,
          "width": true,
          "height": true,
          "frameborder": true,
          "allow": true,
          "allowfullscreen": true
        }
      },
      {
        "name": "^a$",
        "attributes": {
          "target": true
        }
      },
      {
        "name": "^audio$",
        "attributes": {
          "controls": true,
          "src": true
        }
      },
      {
        "name": "^source$",
        "attributes": {
          "src": true,
          "type": true
        }
      },
      {
        "name": "^button$",
        "attributes": {
          "class": true,
          "onclick": true,
          "style": true
        }
      },
      {
        "name": "^div$",
        "attributes": {
          "class": true,
          "id": true,
          "style": true
        }
      },
      {
        "name": "^script$",
        "attributes": {
          "type": true
        }
      }
    ]

  },```

[oliverfoster]

As per pr https://github.com/adaptlearning/adapt_authoring/pull/2780#issue-2467875435

[StuartNicholls]

Part of 'vanilla' theme:

https://github.com/adaptlearning/adapt-contrib-vanilla/wiki/Icons

[ambivalent-axiom]

Part of 'vanilla' theme:

https://github.com/adaptlearning/adapt-contrib-vanilla/wiki/Icons

How did You knew I needed this? :D

[StuartNicholls]

@fosterc1 suggest making the changes to your AAT instances as outlined above. The code from vanilla theme is intended for framework only development so these shouldn't necessarily sync up.

@oliverfoster I'm guessing the 'empty tag' and 'aria-label' issues don't need addressing and adding to the base config as they are not required/supported in legacy AAT and as development is now focused on V1?

[oliverfoster]

I'm guessing the 'empty tag' and 'aria-label' issues don't need addressing

@StuartNicholls you can use the above config to enable the aria-label attributes if you want to use them in an AAT

ckEditor htmlSupport help page: https://ckeditor.com/docs/ckeditor5/latest/features/html/general-html-support.html

I have no idea about blank tags.

'empty tag' and 'aria-label' don't need addressing and adding to the base config as they are not required/supported in legacy AAT

Anyone is more than welcome to do a PR if there is something they want fixing or which is required.

as development is now focused on V1?

No one at Kineo is working on AAT Legacy, I occasionally do urgent bits in my own time but I don't get paid for it and I'm not assigned to it at work at Kineo.

Kineo is focusing on V1.

Please see: https://github.com/adaptlearning/adapt_authoring/issues/2749

[StuartNicholls]

I've seen all that cheers, thanks for taking the time to confirm.

[oliverfoster]

Ok to close?

[StuartNicholls]

Ok to close?

There's a pull request here:

#2816