mohiit1502/Automata
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(editor): Avoid sanitizing output to search node data (#8126)

Browse Source 
## Summary
In search feature, output sanitization was added to support `<mark` tag
in output panel to highlight searched text. This removes any html like
data in the input/output panel..
This PR removes sanitization while keeping text highlights..


## Related tickets and issues
https://community.n8n.io/t/n8n-output/33997
https://community.n8n.io/t/html-tags-in-editor-rendered/34240
https://github.com/n8n-io/n8n/issues/8081
https://linear.app/n8n/issue/ADO-1594/node-output-view-not-consistent
https://linear.app/n8n/issue/ADO-1597/bug-xml-display-issue


## Review / Merge checklist
- [X] PR title and summary are descriptive. **Remember, the title
automatically goes into the changelog. Use `(no-changelog)` otherwise.**
([conventions](https://github.com/n8n-io/n8n/blob/master/.github/pull_request_title_conventions.md))
- [ ] [Docs updated](https://github.com/n8n-io/n8n-docs) or follow-up
ticket created.
- [ ] Tests included.
> A bug is not considered fixed, unless a test is added to prevent it
from happening again.
   > A feature is not complete without tests.
This commit is contained in:
Mutasem Aldmour
2023-12-22 15:03:40 +01:00
committed by GitHub
parent e928210ccd
commit c83d9f45ba
9 changed files with 279 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
packages/editor-ui/src/utils/__tests__/htmlUtils.test.ts
View File

@@ -1,41 +0,0 @@
import { highlightText } from '@/utils/htmlUtils';
describe('highlightText', () => {
it('should return original text if search parameter is an empty string', () => {
const text = 'some text';
const result = highlightText(text);
expect(result).toBe(text);
});
it('should return original text if it is an empty string', () => {
const text = '';
const result = highlightText(text, 'search');
expect(result).toBe(text);
});
it('should escape special characters in the search string', () => {
const text = 'some text [example]';
const result = highlightText(text, '[example]');
expect(result).toBe('some text <mark class="highlight">[example]</mark>');
});
it('should escape other special characters in the search string', () => {
const text = 'phone number: +123-456-7890';
const result = highlightText(text, '+123-456-7890');
expect(result).toBe('phone number: <mark class="highlight">+123-456-7890</mark>');
});
it('should highlight occurrences of the search string in text', () => {
const text = 'example text example';
const result = highlightText(text, 'example');
expect(result).toBe(
'<mark class="highlight">example</mark> text <mark class="highlight">example</mark>',
);
});
it('should return original text if the search string is not found', () => {
const text = 'some text';
const result = highlightText(text, 'notfound');
expect(result).toBe(text);
});
});

6
packages/editor-ui/src/utils/htmlUtils.ts
View File

@@ -63,9 +63,3 @@ export const getBannerRowHeight = async (): Promise<number> => {
}, 0);
});
};
export const highlightText = (text: string, search = ''): string => {
const pattern = search.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, '\\$&');
const regex = new RegExp(`(${pattern})`, 'gi');
return search ? text?.replace(regex, '<mark class="highlight">$1</mark>') : text;
};