mocking messageHtmlToComponent at global level

mattermost · Nov 8, 2024 · 3af750c · 3af750c
1 parent bb3a4bb
commit 3af750c
Show file tree

Hide file tree

Showing 7 changed files with 18 additions and 18 deletions.
diff --git a/webapp/package.json b/webapp/package.json
@@ -97,7 +97,8 @@
 		"collectCoverageFrom": [
 			"src/**/*.{ts,tsx,js,jsx}",
 			"!src/test/**"
-		]
+		],
+		"setupFiles": ["./tests/setupFile.ts"]
 	},
 	"devDependencies": {
 		"@formatjs/cli": "^4.8.2",

diff --git a/webapp/src/components/cardDetail/__snapshots__/commentsList.test.tsx.snap b/webapp/src/components/cardDetail/__snapshots__/commentsList.test.tsx.snap
@@ -67,7 +67,7 @@ exports[`components/cardDetail/CommentsList comments show up 1`] = `
       <div
         class="mocked-message-html"
       >
-        Demo Comments
+        Test Comment
       </div>
     </div>
     <div
@@ -111,7 +111,7 @@ exports[`components/cardDetail/CommentsList comments show up 1`] = `
       <div
         class="mocked-message-html"
       >
-        Demo Comments
+        Test Comment
       </div>
     </div>
     <hr
@@ -153,7 +153,7 @@ exports[`components/cardDetail/CommentsList comments show up in readonly mode 1`
       <div
         class="mocked-message-html"
       >
-        Demo Comments
+        Test Comment
       </div>
     </div>
     <div
@@ -183,7 +183,7 @@ exports[`components/cardDetail/CommentsList comments show up in readonly mode 1`
       <div
         class="mocked-message-html"
       >
-        Demo Comments
+        Test Comment
       </div>
     </div>
     <hr

diff --git a/webapp/src/components/cardDetail/cardDetail.test.tsx b/webapp/src/components/cardDetail/cardDetail.test.tsx
@@ -27,10 +27,6 @@ import CardDetail from './cardDetail'
 
 global.fetch = FetchMock.fn
 jest.mock('../../octoClient')
-jest.mock('../../webapp_globals', () => ({
-    ...jest.requireActual('../../webapp_globals'),
-    messageHtmlToComponent: jest.fn(() => <div className="mocked-message-html">Test Comment</div>),
-}))
 
 const mockedOctoClient = mocked(octoClient, true)
 

diff --git a/webapp/src/components/cardDetail/comment.test.tsx b/webapp/src/components/cardDetail/comment.test.tsx
@@ -20,10 +20,6 @@ import Comment from './comment'
 
 jest.mock('../../mutator')
 const mockedMutator = mocked(mutator, true)
-jest.mock('../../webapp_globals', () => ({
-    ...jest.requireActual('../../webapp_globals'),
-    messageHtmlToComponent: jest.fn(() => <div className="mocked-message-html">Test Comment</div>),
-}))
 
 const board = TestBlockFactory.createBoard()
 const card = TestBlockFactory.createCard(board)

diff --git a/webapp/src/components/cardDetail/commentsList.test.tsx b/webapp/src/components/cardDetail/commentsList.test.tsx
@@ -20,10 +20,6 @@ import {mockMMStore} from '../../../tests/mock_window'
 
 import CommentsList from './commentsList'
 
-jest.mock('../../webapp_globals', () => ({
-    ...jest.requireActual('../../webapp_globals'),
-    messageHtmlToComponent: jest.fn(() => <div className="mocked-message-html">Demo Comments</div>),
-}))
 global.fetch = FetchMock.fn
 jest.spyOn(Utils, 'displayDateTime').mockReturnValue('a long time ago')
 jest.spyOn(Utils, 'relativeDisplayDateTime').mockReturnValue('a long time ago')

diff --git a/webapp/tests/setupFile.ts b/webapp/tests/setupFile.ts
@@ -0,0 +1,10 @@
+import React from 'react'
+import { jest } from '@jest/globals'
+
+jest.mock('../src/webapp_globals', () =>
+    Object.assign({}, jest.requireActual('../src/webapp_globals'), {
+        messageHtmlToComponent: jest.fn(() =>
+            React.createElement('div', { className: 'mocked-message-html' }, 'Test Comment')
+        ),
+    })
+)
diff --git a/webapp/tsconfig.json b/webapp/tsconfig.json
@@ -15,7 +15,8 @@
         "baseUrl": "src",
         "outDir": "./dist",
         "moduleResolution": "node",
-        "skipLibCheck": true
+        "skipLibCheck": true,
+        "types": ["jest", "node"],
     },
     "include": [
 		"src/**/*"