Merge pull request #9882 from overleaf/ii-dashboard-system-message-migration

[web] Project dashboard system & translation message migration GitOrigin-RevId: 0c723a3b526980e5c749da44ebe8a0a3edcc66ad
2022-10-13 08:05:38 +00:00
parent cdbf8c1831
commit 7a20e1376d
13 changed files with 387 additions and 105 deletions
@@ -0,0 +1,87 @@
+import { expect } from 'chai'
+import { render, screen, fireEvent } from '@testing-library/react'
+import fetchMock from 'fetch-mock'
+import SystemMessages from '../../../../../frontend/js/features/project-list/components/notifications/system-messages'
+
+describe('<SystemMessages />', function () {
+  beforeEach(function () {
+    fetchMock.reset()
+    localStorage.clear()
+    window.metaAttributesCache = new Map()
+  })
+
+  afterEach(function () {
+    fetchMock.reset()
+    localStorage.clear()
+    window.metaAttributesCache = new Map()
+  })
+
+  it('renders non-dismissable system message', async function () {
+    const data = {
+      _id: 'protected',
+      content: 'Random content',
+    }
+    fetchMock.get(/\/system\/messages/, [data])
+    render(<SystemMessages />)
+
+    await fetchMock.flush(true)
+
+    screen.getByText(data.content)
+    expect(screen.queryByRole('button', { name: /close/i })).to.be.null
+  })
+
+  it('renders and closes dismissable system message', async function () {
+    const data = {
+      _id: 1,
+      content: 'Random content',
+    }
+    fetchMock.get(/\/system\/messages/, [data])
+    render(<SystemMessages />)
+
+    await fetchMock.flush(true)
+
+    screen.getByText(data.content)
+    const closeBtn = screen.getByRole('button', { name: /close/i })
+    fireEvent.click(closeBtn)
+
+    expect(screen.queryByText(data.content)).to.be.null
+
+    const dismissed = localStorage.getItem(`systemMessage.hide.${data._id}`)
+    expect(dismissed).to.equal('true')
+  })
+
+  it('renders and closes translation message', async function () {
+    const data = {
+      url: '/dev/null',
+      lngName: 'German',
+      imgUrl: 'https://flagcdn.com/w40/de.png',
+    }
+    const currentUrl = '/project'
+    fetchMock.get(/\/system\/messages/, [])
+    window.metaAttributesCache = new Map()
+    window.metaAttributesCache.set('ol-suggestedLanguage', data)
+    window.metaAttributesCache.set('ol-currentUrl', currentUrl)
+    render(<SystemMessages />)
+
+    await fetchMock.flush(true)
+
+    const link = screen.getByRole('link', { name: /click here/i })
+    expect(link.getAttribute('href')).to.equal(`${data.url}${currentUrl}`)
+
+    const flag = screen.getByRole('img', { hidden: true })
+    expect(flag.getAttribute('src')).to.equal(data.imgUrl)
+
+    const closeBtn = screen.getByRole('button', { name: /close/i })
+    fireEvent.click(closeBtn)
+
+    expect(
+      screen.queryByRole('link', {
+        name: `Click here to use Overleaf in ${data.lngName}`,
+      })
+    ).to.be.null
+    expect(screen.queryByRole('img')).to.be.null
+
+    const dismissed = localStorage.getItem('hide-i18n-notification')
+    expect(dismissed).to.equal('true')
+  })
+})