diff --git a/src/__test__/unit/editor.spec.ts b/src/__test__/unit/editor.spec.ts
index c71fd62d53..977a32aaa8 100644
--- a/src/__test__/unit/editor.spec.ts
+++ b/src/__test__/unit/editor.spec.ts
@@ -864,6 +864,24 @@ describe('editor', () => {
expect(wwEditor.innerHTML).toContain(result);
});
+
+ it('should keep the html attributes with an empty string after changing the mode', () => {
+ createEditor({
+ el: container,
+ initialValue: '',
+ previewHighlight: false,
+ // add iframe html block renderer
+ customHTMLRenderer: createHTMLrenderer(),
+ });
+
+ editor.changeMode('wysiwyg');
+
+ const result = oneLineTrim`
+
+ `;
+
+ expect(wwEditor.innerHTML).toContain(result);
+ });
});
describe('hooks option', () => {
diff --git a/src/sanitizer/htmlSanitizer.ts b/src/sanitizer/htmlSanitizer.ts
index d44a1ac50d..93e02b032c 100644
--- a/src/sanitizer/htmlSanitizer.ts
+++ b/src/sanitizer/htmlSanitizer.ts
@@ -16,7 +16,7 @@ const reHTMLAttr = new RegExp(
'ismap|lang|language|nohref|nowrap|rel|rev|rows|rules|' +
'scope|scrolling|shape|size|span|start|summary|tabindex|target|title|type|' +
'valign|value|vspace|width|checked|mathvariant|encoding|id|name|' +
- 'background|cite|href|longdesc|src|usemap|xlink:href|data-+|checked|style)',
+ 'background|cite|href|longdesc|src|usemap|xlink:href|data-+|checked|style|controls)',
'g'
);
diff --git a/src/utils/common.ts b/src/utils/common.ts
index 010e3934a9..d723350a82 100644
--- a/src/utils/common.ts
+++ b/src/utils/common.ts
@@ -108,7 +108,7 @@ export function quote(text: string) {
return result[0] + text + result[1];
}
-function isNil(value: unknown): value is null | undefined {
+export function isNil(value: unknown): value is null | undefined {
return isNull(value) || isUndefined(value);
}
diff --git a/src/utils/dom.ts b/src/utils/dom.ts
index 8dc96c6ae8..cebc57a703 100644
--- a/src/utils/dom.ts
+++ b/src/utils/dom.ts
@@ -7,6 +7,7 @@ import addClass from 'tui-code-snippet/domUtil/addClass';
import removeClass from 'tui-code-snippet/domUtil/removeClass';
import matches from 'tui-code-snippet/domUtil/matches';
import { HTML_TAG, OPEN_TAG } from './constants';
+import { isNil } from './common';
export function isPositionInBox(style: CSSStyleDeclaration, offsetX: number, offsetY: number) {
const left = parseInt(style.left, 10);
@@ -229,10 +230,10 @@ export function prependNode(node: Element, appended: string | ArrayLike
export function setAttributes(attributes: Record, element: HTMLElement) {
Object.keys(attributes).forEach((attrName) => {
- if (attributes[attrName]) {
- element.setAttribute(attrName, attributes[attrName]);
- } else {
+ if (isNil(attributes[attrName])) {
element.removeAttribute(attrName);
+ } else {
+ element.setAttribute(attrName, attributes[attrName]);
}
});
}