Merge pull request #2760 from ORCID/lmendoza/PD-5100

Lmendoza/pd 5100

Author: cryptalith

projects/orcid-registry-ui/src/lib/components/permission-notifications/permission-notifications.component.ts

@@ -6,7 +6,7 @@ import {
   Output,
 } from '@angular/core'
 import { DomSanitizer } from '@angular/platform-browser'
-import { sanitizeHtmlForTrustedBypass } from '../../utils/sanitize-html-for-trusted-bypass'
+import { sanitizeHtmlForTrustedBypass } from '@orcid/ui'
 import {
   NgClass,
   NgFor,

projects/orcid-registry-ui/src/lib/utils/sanitize-html-for-trusted-bypass.ts

@@ -0,0 +1,38 @@
+import { sanitizeHtmlForTrustedBypass } from './sanitize-html-for-trusted-bypass'
+
+describe('sanitizeHtmlForTrustedBypass', () => {
+  it('strips script tags and their content', () => {
+    const html = 'Hello <script>alert(1)</script> world'
+    expect(sanitizeHtmlForTrustedBypass(html)).toBe('Hello  world')
+  })
+
+  it('strips script tags with attributes', () => {
+    const html = 'Foo <script type="text/javascript">evil()</script> bar'
+    expect(sanitizeHtmlForTrustedBypass(html)).toBe('Foo  bar')
+  })
+
+  it('strips style tags and their content', () => {
+    const html = 'Text <style>.x { color: red }</style> more'
+    expect(sanitizeHtmlForTrustedBypass(html)).toBe('Text  more')
+  })
+
+  it('strips img tags (e.g. img with onerror)', () => {
+    const html = `test <img src=x onerror=alert('malicious-code')>`
+    expect(sanitizeHtmlForTrustedBypass(html)).toBe('test ')
+  })
+
+  it('strips event-handler attributes from any tag', () => {
+    const html = '<span onclick="alert(1)">click</span>'
+    expect(sanitizeHtmlForTrustedBypass(html)).toBe('<span>click</span>')
+  })
+
+  it('leaves safe markup intact', () => {
+    const html = '<span class="highlight">safe</span>'
+    expect(sanitizeHtmlForTrustedBypass(html)).toBe(html)
+  })
+
+  it('returns empty string for non-string input', () => {
+    expect(sanitizeHtmlForTrustedBypass(null as any)).toBe('')
+    expect(sanitizeHtmlForTrustedBypass(undefined as any)).toBe('')
+  })
+})

projects/orcid-ui/src/lib/utils/sanitize-html-for-trusted-bypass.spec.ts

@@ -0,0 +1,21 @@
+/**
+ * Sanitizes HTML by removing script/style tags, executable elements (img, iframe,
+ * etc.), and event-handler attributes so the result is safe to pass to
+ * DomSanitizer.bypassSecurityTrustHtml().
+ * Use this whenever you need to render HTML that may contain user/content while
+ * allowing only safe markup (e.g. no scripts).
+ */
+export function sanitizeHtmlForTrustedBypass(html: string): string {
+  if (typeof html !== 'string') {
+    return ''
+  }
+  return html
+    .replace(/<script\b[^>]*>[\s\S]*?<\/script>/gi, '')
+    .replace(/<style\b[^>]*>[\s\S]*?<\/style>/gi, '')
+    .replace(/<img\b[^>]*>/gi, '')
+    .replace(/<iframe\b[^>]*>[\s\S]*?<\/iframe>/gi, '')
+    .replace(/<object\b[^>]*>[\s\S]*?<\/object>/gi, '')
+    .replace(/<embed\b[^>]*>/gi, '')
+    .replace(/<svg\b[^>]*>[\s\S]*?<\/svg>/gi, '')
+    .replace(/\s+on\w+\s*=\s*(?:"[^"]*"|'[^']*'|[^\s>]*)/gi, '')
+}

projects/orcid-ui/src/lib/utils/sanitize-html-for-trusted-bypass.ts

@@ -2,6 +2,7 @@
  * Public API Surface of orcid-ui
  */
 
+export * from './lib/utils/sanitize-html-for-trusted-bypass'
 export * from './lib/orcid-ui'
 export * from './lib/components/record-header/record-header.component'
 export * from './lib/components/text-with-tooltip/text-with-tooltip.component'

projects/orcid-ui/src/public-api.ts

@@ -61,9 +61,13 @@ export class SnackbarService {
     }
 
     if (errorReport?.analytics) {
+      const description = `${errorReport.analytics.code}/${error?.message ?? ''}`.replace(
+        / /g,
+        ''
+      )
       console.error(`
         __Report error GA__
-        description: ${errorReport.analytics.code}/${error.message}\`.replace(/ /g, '')
+        description: ${description}
         fatal: ${errorReport.analytics.fatal}
         `)
     }

src/app/cdk/snackbar/snackbar.service.ts

@@ -15,10 +15,10 @@ export class HttpContentTypeHeaderInterceptor implements HttpInterceptor {
   construct() {}
 
   intercept(req: HttpRequest<any>, next: HttpHandler) {
-    var method = req.method
-    var urlWithParams = req.urlWithParams
+    var method = req.method ?? ''
+    var urlWithParams = req.urlWithParams ?? req.url ?? ''
     // If the request contains a content type, be sure to set the encoding to utf-8
-    if (['POST', 'PUT'].includes(method)) {
+    if (method && ['POST', 'PUT'].includes(method)) {
       var clonedRequest
       if (this.formUrlEcondedUrls.find((x) => urlWithParams.includes(x))) {
         clonedRequest = req.clone({

src/app/core/http-content-type-header-interceptor/http-content-type-header-interceptor.ts

@@ -39,10 +39,10 @@ export class XsrfFallbackInterceptor implements HttpInterceptor {
       return next.handle(req)
     }
 
-    const method = req.method.toUpperCase()
+    const method = (req.method ?? '').toUpperCase()
 
     // Only care about mutating requests
-    if (!['POST', 'PUT', 'PATCH', 'DELETE'].includes(method)) {
+    if (!method || !['POST', 'PUT', 'PATCH', 'DELETE'].includes(method)) {
       return next.handle(req)
     }
 

src/app/core/xsrf/xsrf-fallback.interceptor.ts

@@ -1,6 +1,6 @@
 import { Pipe, PipeTransform } from '@angular/core'
 import { DomSanitizer } from '@angular/platform-browser'
-import { sanitizeHtmlForTrustedBypass } from '../../utils/sanitize-html-for-trusted-bypass'
+import { sanitizeHtmlForTrustedBypass } from '@orcid/ui'
 
 @Pipe({
   name: 'safeHtml',

src/app/shared/pipes/safe-html/safe-html.pipe.ts

@@ -1,6 +1,6 @@
 import { Pipe, PipeTransform } from '@angular/core'
 import { DomSanitizer, SafeHtml } from '@angular/platform-browser'
-import { sanitizeHtmlForTrustedBypass } from '../../utils/sanitize-html-for-trusted-bypass'
+import { sanitizeHtmlForTrustedBypass } from '@orcid/ui'
 
 @Pipe({
   name: 'searchTermHighlight',