feat: #1123 render renderHTML for diff compare of approval modal

Changes - Add diff viewer for RenderHTML component
reapit · May 5, 2020 · dd90c9e · dd90c9e
1 parent 0669a93
commit dd90c9e
Show file tree

Hide file tree

Showing 20 changed files with 152 additions and 63 deletions.
diff --git a/packages/cognito-auth/src/tests/badges/badge-branches.svg b/packages/cognito-auth/src/tests/badges/badge-branches.svg
diff --git a/packages/cognito-auth/src/tests/badges/badge-functions.svg b/packages/cognito-auth/src/tests/badges/badge-functions.svg
diff --git a/packages/cognito-auth/src/tests/badges/badge-lines.svg b/packages/cognito-auth/src/tests/badges/badge-lines.svg
diff --git a/packages/cognito-auth/src/tests/badges/badge-statements.svg b/packages/cognito-auth/src/tests/badges/badge-statements.svg
diff --git a/packages/elements/src/components/HtmlRender/__tests__/__snapshots__/index.tsx.snap b/packages/elements/src/components/HtmlRender/__tests__/__snapshots__/index.tsx.snap
@@ -1,7 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`HTMLRender should render match to snapshot 1`] = `
-<Component>
+<Component
+  className=""
+>
   
         
   <div

diff --git a/packages/elements/src/components/HtmlRender/index.tsx b/packages/elements/src/components/HtmlRender/index.tsx
@@ -6,9 +6,10 @@ import { Content } from '../Layout'
 export interface HTMLRenderProps {
   html: string
   diffing?: boolean
+  className?: string
 }
 
-export const HTMLRender: React.SFC<HTMLRenderProps> = ({ html, diffing = false }: HTMLRenderProps) => {
+export const HTMLRender: React.SFC<HTMLRenderProps> = ({ html, diffing = false, className = '' }: HTMLRenderProps) => {
   const jsonElements = parse(html)
-  return <Content>{renderer(jsonElements, diffing)}</Content>
+  return <Content className={className}>{renderer(jsonElements, diffing)}</Content>
 }
diff --git a/packages/elements/src/tests/badges/badge-branches.svg b/packages/elements/src/tests/badges/badge-branches.svg
diff --git a/packages/elements/src/tests/badges/badge-functions.svg b/packages/elements/src/tests/badges/badge-functions.svg
diff --git a/packages/elements/src/tests/badges/badge-lines.svg b/packages/elements/src/tests/badges/badge-lines.svg
diff --git a/packages/elements/src/tests/badges/badge-statements.svg b/packages/elements/src/tests/badges/badge-statements.svg
diff --git a/packages/marketplace/src/components/ui/__tests__/__snapshots__/diff-render-html.tsx.snap b/packages/marketplace/src/components/ui/__tests__/__snapshots__/diff-render-html.tsx.snap
@@ -0,0 +1,17 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DiffRenderHTML should match a snapshot 1`] = `
+<div>
+  <Component
+    className="undefined undefined"
+    html="abc"
+  />
+  <span>
+    →
+  </span>
+  <Component
+    className="undefined undefined"
+    html="<b>axxxxxxxxxxxbc<b>"
+  />
+</div>
+`;
diff --git a/packages/marketplace/src/components/ui/__tests__/diff-render-html.tsx b/packages/marketplace/src/components/ui/__tests__/diff-render-html.tsx
@@ -0,0 +1,18 @@
+import * as React from 'react'
+import { shallow } from 'enzyme'
+import DiffRenderHTML, { DiffRenderHTMLProps } from '../diff-render-html'
+
+const props: DiffRenderHTMLProps = {
+  currentString: 'abc',
+  changedString: '<b>axxxxxxxxxxxbc<b>',
+}
+
+describe('DiffRenderHTML', () => {
+  it('should match a snapshot', () => {
+    expect(shallow(<DiffRenderHTML {...props} />)).toMatchSnapshot()
+  })
+
+  afterEach(() => {
+    jest.resetAllMocks()
+  })
+})
diff --git a/...nts/ui/app-revision-comparision/__tests__/__snapshots__/app-revision-comparision.tsx.snap b/...nts/ui/app-revision-comparision/__tests__/__snapshots__/app-revision-comparision.tsx.snap
@@ -117,7 +117,7 @@ exports[`AdminRevisionModalInner should match a snapshot 1`] = `
     >
       Description
     </h4>
-    <DiffViewer
+    <DiffRenderHTML
       changedString="Download the app now and start shopping our selection of fashion, books, toys, home
       appliances, sport accessories and much more.
 
@@ -138,7 +138,6 @@ Get
     elementum integer enim neque volutpat ac tincidunt vitae semper quis lectus nulla 
     at volutpat diam ut venenatis tellus in metus vulputate eu scelerisque felis imperdiet 
     proin fermentum leo vel orci porta non pulvinar neque laoreet suspendisse interdum co"
-      type="words"
     />
   </div>
   <div