@ecency/render-helper 2.3.8 → 2.3.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ecency/render-helper",
-  "version": "2.3.8",
+  "version": "2.3.10",
   "description": "Markdown+Html Render helper",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",

package/src/consts/allowed-attributes.const.ts

@@ -19,7 +19,8 @@ export const ALLOWED_ATTRIBUTES: XSSWhiteList = {
     'data-is-inline',
     'class',
     'title',
-    'data-id'
+    'data-id',
+    'id'
   ],
   'img': [
     'src',
@@ -30,9 +31,9 @@ export const ALLOWED_ATTRIBUTES: XSSWhiteList = {
     'decoding',
     'itemprop'
   ],
-  'span': ['class'],
+  'span': ['class', 'id'],
   'iframe': ['src', 'class', 'frameborder', 'allowfullscreen', 'webkitallowfullscreen', 'mozallowfullscreen', 'sandbox'],
-  'div': ['class'],
+  'div': ['class', 'id'],
   'strong': [],
   'b': [],
   'i': [],
@@ -43,13 +44,13 @@ export const ALLOWED_ATTRIBUTES: XSSWhiteList = {
   'blockquote': ['class'],
   'sup': [],
   'sub': [],
-  'h1': ['dir'],
-  'h2': ['dir'],
-  'h3': ['dir'],
-  'h4': ['dir'],
-  'h5': ['dir'],
-  'h6': ['dir'],
-  'p': ['dir'],
+  'h1': ['dir', 'id'],
+  'h2': ['dir', 'id'],
+  'h3': ['dir', 'id'],
+  'h4': ['dir', 'id'],
+  'h5': ['dir', 'id'],
+  'h6': ['dir', 'id'],
+  'p': ['dir', 'id'],
   'center': [],
   'ul': [],
   'ol': [],

package/src/consts/regexes.const.ts

@@ -42,3 +42,5 @@ export const LOOM_EMBED_REGEX = /^(https?:)?\/\/www.loom.com\/embed\/(.*)/i
 export const AUREAL_EMBED_REGEX = /^(https?:\/\/)?(www\.)?(?:aureal-embed)\.web\.app\/([0-9]+)/i
 export const ENTITY_REGEX = /&([a-z0-9]+|#[0-9]{1,6}|#x[0-9a-fA-F]{1,6});/ig
 export const SECTION_REGEX = /\B(\#[\da-zA-Z-_]+\b)(?!;)/i
+export const ID_WHITELIST = /^[A-Za-z][-A-Za-z0-9_]*$/
+

package/src/markdown-2-html.spec.ts

@@ -946,7 +946,7 @@ describe('Markdown2Html', () => {
         last_update: '2019-05-10T09:15:21',
         body: 'this is link https://inleo.io/@godfish/close-range-reflections'
       }
-      const expected = '<p dir=\"auto\">this is link <a href="/post/@godfish/close-range-reflections" class="markdown-post-link">@godfish/close-range-reflections</a></p>'
+      const expected = '<p dir=\"auto\">this is link <a href="/post/@godfish/close-range-reflections" class="markdown-post-link" data-is-inline="false">@godfish/close-range-reflections</a></p>'
 
       expect(markdown2Html(input, false)).toBe(expected)
     })
@@ -1161,7 +1161,7 @@ describe('Markdown2Html', () => {
         last_update: '2019-05-10T09:15:21',
         body: 'https://img.esteem.ws/bbq3ob1idy.png <a href="https://steemit.com/esteem/@esteemapp/esteem-monthly-guest-curation-program-4">fooo</a> <a href="/esteem/@esteemapp/esteem-monthly-guest-curation-program-4">bar</a> <a href="http://external.com/loromoro">baz</a> #lorem @ipsum <a href=\'https://steemit.com/~witnesses\'>vote me</a>'
       }
-      const expected = '<p dir=\"auto\"><img class="markdown-img-link" src="https://images.ecency.com/p/o1AJ9qDyyJNSpZWhUgGYc3MngFqoAMwgbeMkkd8SVxyfRVjiN.png?format=match&amp;mode=fit" loading="lazy" decoding="async" itemprop="image" /> <a href="https://steemit.com/esteem/@esteemapp/esteem-monthly-guest-curation-program-4" class="markdown-external-link" target="_blank" rel="noopener">fooo</a> <a href="/esteem/@esteemapp/esteem-monthly-guest-curation-program-4" class="markdown-post-link">bar</a> <a href="http://external.com/loromoro" class="markdown-external-link" target="_blank" rel="noopener">baz</a><span> <a class="markdown-tag-link" href="/trending/lorem">#lorem</a> <a class="markdown-author-link" href="/@ipsum">@ipsum</a> </span><a href="https://steemit.com/~witnesses" class="markdown-external-link" target="_blank" rel="noopener">vote me</a></p>'
+      const expected = '<p dir=\"auto\"><img class="markdown-img-link" src="https://images.ecency.com/p/o1AJ9qDyyJNSpZWhUgGYc3MngFqoAMwgbeMkkd8SVxyfRVjiN.png?format=match&amp;mode=fit" loading="lazy" decoding="async" itemprop="image" /> <a href="https://steemit.com/esteem/@esteemapp/esteem-monthly-guest-curation-program-4" class="markdown-external-link" target="_blank" rel="noopener">fooo</a> <a href="/esteem/@esteemapp/esteem-monthly-guest-curation-program-4" class="markdown-post-link" data-is-inline="true">bar</a> <a href="http://external.com/loromoro" class="markdown-external-link" target="_blank" rel="noopener">baz</a><span> <a class="markdown-tag-link" href="/trending/lorem">#lorem</a> <a class="markdown-author-link" href="/@ipsum">@ipsum</a> </span><a href="https://steemit.com/~witnesses" class="markdown-external-link" target="_blank" rel="noopener">vote me</a></p>'
 
       expect(markdown2Html(input, false)).toBe(expected)
     })

package/src/methods/a.method.ts

@@ -121,6 +121,7 @@ export function a(el: HTMLElement, forApp: boolean, webp: boolean): void {
     } else {
       const h = `/${tag}/@${author}/${permlink}`
       el.setAttribute('href', h)
+      el.setAttribute('data-is-inline', '' + isInline)
     }
     return
   }
@@ -208,6 +209,7 @@ export function a(el: HTMLElement, forApp: boolean, webp: boolean): void {
       } else {
         const h = `/${tag}/@${author}/${permlink}`
         el.setAttribute('href', h)
+        el.setAttribute('data-is-inline', '' + isInline)
       }
 
       return
@@ -286,6 +288,7 @@ export function a(el: HTMLElement, forApp: boolean, webp: boolean): void {
       } else {
         const h = `/${tag}/@${author}/${permlink}`
         el.setAttribute('href', h)
+        el.setAttribute('data-is-inline', '' + isInline)
       }
 
       return
@@ -391,6 +394,7 @@ export function a(el: HTMLElement, forApp: boolean, webp: boolean): void {
     } else {
       const h = `/${tag}/@${author}/${permlink}`
       el.setAttribute('href', h)
+      el.setAttribute('data-is-inline', '' + isInline)
     }
     return
   }

package/src/methods/sanitize-html.method.ts

@@ -1,5 +1,5 @@
 import xss from 'xss'
-import { ALLOWED_ATTRIBUTES } from '../consts'
+import {ALLOWED_ATTRIBUTES, ID_WHITELIST} from '../consts'
 
 const decodeEntities = (input: string): string =>
   input
@@ -19,7 +19,9 @@ export function sanitizeHtml(html: string): string {
       if (tag === 'img' && name === 'src' && (!/^https?:\/\//.test(decoded) || decoded.startsWith('javascript:'))) return '';
       if (tag === 'img' && ['dynsrc', 'lowsrc'].includes(name)) return '';
       if (tag === 'span' && name === 'class' && value === 'wr') return '';
-
+      if (name === 'id') {
+        if (!ID_WHITELIST.test(decoded)) return '';
+      }
       return undefined;
     }
   });