fix(paste): handle pasteConfig with tag names specified in upper case (#2217)

* toLower case added

* regression test case added

* change log update

* version updated

* Apply suggestions from code review

Co-authored-by: Peter Savchenko <specc.dev@gmail.com>

* Update docs/CHANGELOG.md

Co-authored-by: Peter Savchenko <specc.dev@gmail.com>

Co-authored-by: Peter Savchenko <specc.dev@gmail.com>
This commit is contained in:
Umang G. Patel 2022-12-14 14:25:02 +05:30 committed by GitHub
parent b9a0665672
commit c97f0842f5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 100 additions and 24 deletions

View file

@ -1,5 +1,8 @@
# Changelog
### 2.26.3
- `Fix`*Paste Module* — fix for a problem with specifying of `pasteConfig().tags` in upper case [#2208](https://github.com/codex-team/editor.js/issues/2208).
### 2.26.2

View file

@ -1,6 +1,6 @@
{
"name": "@editorjs/editorjs",
"version": "2.26.2",
"version": "2.26.3",
"description": "Editor.js — Native JS, based on API and Open Source",
"main": "dist/editor.js",
"types": "./types/index.d.ts",

View file

@ -639,7 +639,7 @@ export default class Paste extends Module {
tags.forEach((tag) => {
const sanitizationConfig = _.isObject(tagOrSanitizeConfig) ? tagOrSanitizeConfig[tag] : null;
result[tag] = sanitizationConfig || {};
result[tag.toLowerCase()] = sanitizationConfig || {};
});
return result;

View file

@ -213,12 +213,12 @@ describe('Editor Tools Api', () => {
icon: ICON,
name: 'testToolTune',
onActivate: (): void => {},
onActivate: (): void => { },
};
}
/** Save method stub */
public save(): void {}
public save(): void { }
/** Renders a block */
public render(): HTMLElement {
@ -283,20 +283,20 @@ describe('Editor Tools Api', () => {
icon: ICON,
name: 'testToolTune1',
onActivate: (): void => {},
onActivate: (): void => { },
},
{
label: 'Test tool tune 2',
icon: ICON,
name: 'testToolTune2',
onActivate: (): void => {},
onActivate: (): void => { },
},
];
}
/** Save method stub */
public save(): void {}
public save(): void { }
/** Renders a block */
public render(): HTMLElement {
@ -366,7 +366,7 @@ describe('Editor Tools Api', () => {
}
/** Save method stub */
public save(): void {}
public save(): void { }
/** Renders a block */
public render(): HTMLElement {
@ -431,15 +431,15 @@ describe('Editor Tools Api', () => {
/** config specified handled tag */
public static get pasteConfig(): PasteConfig {
return {
tags: [ 'img' ], // only tag name specified. Attributes should be sanitized
tags: ['img'], // only tag name specified. Attributes should be sanitized
};
}
/** onPaste callback will be stubbed below */
public onPaste(): void {}
public onPaste(): void { }
/** save is required for correct implementation of the BlockTool class */
public save(): void {}
public save(): void { }
/** render is required for correct implementation of the BlockTool class */
public render(): HTMLElement {
@ -483,15 +483,15 @@ describe('Editor Tools Api', () => {
/** config specified handled tag */
public static get pasteConfig(): PasteConfig {
return {
tags: [ 'img' ], // only tag name specified. Attributes should be sanitized
tags: ['img'], // only tag name specified. Attributes should be sanitized
};
}
/** onPaste callback will be stubbed below */
public onPaste(): void {}
public onPaste(): void { }
/** save is required for correct implementation of the BlockTool class */
public save(): void {}
public save(): void { }
/** render is required for correct implementation of the BlockTool class */
public render(): HTMLElement {
@ -526,6 +526,79 @@ describe('Editor Tools Api', () => {
});
});
/**
* tags: ['OL','LI',]
* -><ol>
* <li></li>
* <li></li>
* </ol>
*/
it('should sanitize all attributes from tags, even if tag names specified in uppercase', () => {
/**
* Variable used for spying the pasted element we are passing to the Tool
*/
let pastedElement;
/**
* Test tool with pasteConfig.tags specified
*/
class TestListTool {
/** config specified handled tag */
public static get pasteConfig(): PasteConfig {
return {
tags: ['OL', 'LI'], // tag names specified in upper case
};
}
/** onPaste callback will be stubbed below */
public onPaste(): void { }
/** save is required for correct implementation of the BlockTool class */
public save(): void { }
/** render is required for correct implementation of the BlockTool class */
public render(): HTMLElement {
return document.createElement('ol');
}
}
/**
* Stub the onPaste method to access the PasteEvent data for assertion
*/
cy.stub(TestListTool.prototype, 'onPaste').callsFake((event: HTMLPasteEvent) => {
pastedElement = event.detail.data;
});
cy.createEditor({
tools: {
testListTool: TestListTool,
},
});
cy.get('[data-cy=editorjs]')
.get('div.ce-block')
.click()
.paste({
// eslint-disable-next-line @typescript-eslint/naming-convention
'text/html': '<ol start="50"><li>Orderd List</li><li>Unorderd List</li></ol>', // all attributes should be sanitized, <li> should be preserved
})
.then(() => {
expect(pastedElement).not.to.be.undefined;
expect(pastedElement.tagName.toLowerCase()).eq('ol');
expect(pastedElement.attributes.length).eq(0);
// check number of children
expect(pastedElement.children.length).eq(2);
/**
* Check that all children are <li> tags
*/
pastedElement.childNodes.forEach((child) => {
expect(child.tagName.toLowerCase()).eq('li');
expect(child.attributes.length).eq(0);
});
});
});
/**
* tags: [{
* img: {
@ -559,10 +632,10 @@ describe('Editor Tools Api', () => {
}
/** onPaste callback will be stubbed below */
public onPaste(): void {}
public onPaste(): void { }
/** save is required for correct implementation of the BlockTool class */
public save(): void {}
public save(): void { }
/** render is required for correct implementation of the BlockTool class */
public render(): HTMLElement {
@ -637,14 +710,14 @@ describe('Editor Tools Api', () => {
}
/** onPaste callback will be stubbed below */
public onPaste(): void {}
public onPaste(): void { }
/** save is required for correct implementation of the BlockTool class */
public save(): void {}
public save(): void { }
/** render is required for correct implementation of the BlockTool class */
public render(): HTMLElement {
return document.createElement('tbody');
return document.createElement('video');
}
}
@ -721,14 +794,14 @@ describe('Editor Tools Api', () => {
}
/** onPaste callback will be stubbed below */
public onPaste(): void {}
public onPaste(): void { }
/** save is required for correct implementation of the BlockTool class */
public save(): void {}
public save(): void { }
/** render is required for correct implementation of the BlockTool class */
public render(): HTMLElement {
return document.createElement('tbody');
return document.createElement('video');
}
}
@ -797,10 +870,10 @@ describe('Editor Tools Api', () => {
}
/** onPaste callback will be stubbed below */
public onPaste(): void {}
public onPaste(): void { }
/** save is required for correct implementation of the BlockTool class */
public save(): void {}
public save(): void { }
/** render is required for correct implementation of the BlockTool class */
public render(): HTMLElement {