Remove "Bachelor" section from "Education" (#212)

src/__tests__/components/Certificates/CertificatesMain.spec.tsx

@@ -40,7 +40,7 @@ test('should render CertificatesMain correctly', () => {
  expect(aCardLinkElements.item(2)).toHaveAttribute('href', 'http://ude.my/UC-JGDVYKAQ')
  expect(aCardLinkElements.item(3)).toHaveAttribute('href', 'https://www.coursera.org/account/accomplishments/specialization/W5AB2PBZQNPY')
  expect(aCardLinkElements.item(4)).toHaveAttribute('href', 'https://www.coursera.org/account/accomplishments/verify/MWE43H8YDS')
- const divCardFooterElements = container.querySelectorAll('div.card-footer div')
+ const divCardFooterElements = container.querySelectorAll('div.card-footer')
  expect(divCardFooterElements).toHaveLength(5)
  expect(divCardFooterElements.item(0)).toHaveTextContent('business-card-month-9 2020')
  expect(divCardFooterElements.item(1)).toHaveTextContent('business-card-month-5 2020')

src/__tests__/components/Education/EducationItem.spec.tsx

@@ -1,23 +1,24 @@
-/// <reference types="jest" />
+import '@testing-library/jest-dom'
 import * as React from 'react'
-import { shallow, ShallowWrapper } from 'enzyme'
-import EducationItem from '../../../components/Education/EducationItem'
-import { useTranslation } from '../../__mocks__/react-i18next'
+import configureMockStore from 'redux-mock-store'
+import { Provider } from 'react-redux'
+import { render } from '@testing-library/react'
 
-let tMock
+import EducationItem from '../../../components/Education/EducationItem'
+import { testEducationItem } from './scripts'
 
-beforeAll(() => {
- tMock = useTranslation().t
-})
+const mockStore = configureMockStore()
+const store = mockStore({})
 
 test('should render EducationItem correctly', () => {
- const wrapper: ShallowWrapper = shallow(<EducationItem
- from={2019}
- to={2020}
- title="test-title"
- />)
- expect(wrapper).toMatchSnapshot()
- expect(tMock).toHaveBeenCalledTimes(2)
- expect(tMock).toHaveBeenCalledWith('business-card-education-university-title')
- expect(tMock).toHaveBeenCalledWith('business-card-education-university-speciality')
+ const { container } = render(
+ <Provider store={store}>
+ <EducationItem
+ from={2019}
+ to={2020}
+ title="test-title"
+ />
+ </Provider>
+ )
+ testEducationItem(container, 2019, 2020, 'test-title')
 })

src/__tests__/components/Education/EducationMain.spec.tsx

@@ -1,20 +1,23 @@
-/// <reference types="jest" />
+import '@testing-library/jest-dom'
 import * as React from 'react'
-import { shallow, ShallowWrapper } from 'enzyme'
-import EducationMain from '../../../components/Education/EducationMain'
-import { useTranslation } from '../../__mocks__/react-i18next'
+import configureMockStore from 'redux-mock-store'
+import { Provider } from 'react-redux'
+import { render, screen } from '@testing-library/react'
 
-let tMock
+import EducationMain from '../../../components/Education/EducationMain'
+import { testEducationItem } from './scripts'
 
-beforeAll(() => {
- tMock = useTranslation().t
-})
+const mockStore = configureMockStore()
+const store = mockStore({})
 
 test('should render EducationItem correctly', () => {
- const wrapper: ShallowWrapper = shallow(<EducationMain />)
- expect(wrapper).toMatchSnapshot()
- expect(tMock).toHaveBeenCalledTimes(3)
- expect(tMock).toHaveBeenCalledWith('business-card-education-title')
- expect(tMock).toHaveBeenCalledWith('business-card-education-university-master')
- expect(tMock).toHaveBeenCalledWith('business-card-education-university-bachelor')
+ render(
+ <Provider store={store}>
+ <EducationMain />
+ </Provider>
+ )
+ expect(screen.getByRole('heading', { level: 2 }))
+ .toHaveTextContent('business-card-education-title')
+ const listItem = screen.getByRole('listitem')
+ testEducationItem(listItem, 2005, 2010, 'business-card-education-university-master')
 })

src/__tests__/components/Education/scripts.ts

@@ -0,0 +1,17 @@
+import '@testing-library/jest-dom'
+
+/* eslint-disable no-undef */
+export function testEducationItem(
+ container: HTMLElement, from: number, to: number, title: string) {
+ const h4DateLocaleElements = container.querySelectorAll('div.timeline-image h4')
+ expect(h4DateLocaleElements).toHaveLength(1)
+ expect(h4DateLocaleElements.item(0)).toHaveTextContent(`${to}-${from}`)
+ const h4TimelineElements = container.querySelectorAll('div.timeline-heading h4')
+ expect(h4TimelineElements).toHaveLength(2)
+ expect(h4TimelineElements.item(0)).toHaveTextContent('business-card-education-university-title')
+ expect(h4TimelineElements.item(1)).toHaveTextContent(title)
+ const pBodyElements = container.querySelectorAll('div.timeline-body p')
+ expect(pBodyElements).toHaveLength(1)
+ expect(pBodyElements.item(0)).toHaveTextContent('business-card-education-university-speciality')
+}
+/* eslint-enable */

src/__tests__/components/Experience/__snapshots__/JobPeriod.spec.tsx.snap

@@ -15,6 +15,7 @@ exports[`should render JobPeriod correctly 1`] = `
  month={4}
  year={2020}
  />
+ <br />
  - 
  <br />
  <Connect(DateLocale)

src/__tests__/components/Skills.spec.tsx

@@ -35,7 +35,7 @@ test('should render Skills correctly', () => {
  ]
 
  for (const { alt, title } of expectedSkills) {
- const img = screen.getByAltText(alt);
+ const img = screen.getByAltText(alt)
  expect(img).toHaveAttribute('title', title)
  expect(img).toHaveAttribute('src', '[object Object]')
  }

src/__tests__/components/controls/DateLocale.spec.tsx

@@ -1,100 +1,34 @@
-/// <reference types="jest" />
 import * as React from 'react'
-import { shallow, ShallowWrapper } from 'enzyme'
-import { DateLocale } from '../../../components/controls/DateLocale'
-import { useTranslation } from '../../__mocks__/react-i18next'
+import { render } from '@testing-library/react'
+import '@testing-library/jest-dom'
 
-let tMock
+import { DateLocale } from '../../../components/controls/DateLocale'
+import { Locale } from '../../../store/locale/types'
 
-beforeAll(() => {
- tMock = useTranslation().t
+test('should render correctly with month, year and non-JP locale', () => {
+ const { container } = render(
+ <DateLocale year={2022} month={1} locale={new Locale('en', 'EN')} />
+ )
+ expect(container).toHaveTextContent('business-card-month-1 2022')
 })
 
-interface DateLocaleFixture {
- title: string
- locale: string
- expect: (toDoubleByteSpy: jest.Mock<string, string[]>, year: number, month?: number) => void
-}
+test('should render correctly with year and non-JP locale', () => {
+ const { container } = render(
+ <DateLocale year={2001} locale={new Locale('en', 'EN')} />
+ )
+ expect(container).toHaveTextContent('2001')
+})
 
-new Array<DateLocaleFixture>({
- title: 'JP',
- locale: 'jp',
- expect: (toDoubleByteSpy, year, month) => {
- expect(tMock).toHaveBeenCalledTimes(2)
- expect(tMock).toHaveBeenNthCalledWith(1, 'business-card-year-singular')
- expect(tMock).toHaveBeenNthCalledWith(2, `business-card-month-${month}`)
- expect(toDoubleByteSpy).toHaveBeenCalledWith(year.toString())
- }
-}, {
- title: 'non-JP',
- locale: 'gb',
- expect: (toDoubleByteSpy, year, month) => {
- expect(tMock).toHaveBeenCalledTimes(1)
- expect(tMock).toHaveBeenCalledWith(`business-card-month-${month}`)
- expect(toDoubleByteSpy).not.toHaveBeenCalled()
- }
-}).forEach((f) =>
- test(`should render DateLocale with month in ${f.title} locale correctly`, () => {
- const month = 1
- const year = 2019
- tMock.mockImplementation((k) => `${f.locale}-${k}`)
- const toDoubleByteSpy: jest.Mock<string, string[]> = jest.fn((k) => k)
- const wrapper: ShallowWrapper = shallow(
- <DateLocale
- converter={{
- _convert: null,
- toDoubleByte: toDoubleByteSpy,
- toSingleByte: null
- }}
- locale={{
- code: f.locale,
- title: ''
- }}
- month={month}
- year={year}
- />
- )
- expect(wrapper).toMatchSnapshot()
- f.expect(toDoubleByteSpy, year, month)
- })
-)
+test('should render correctly with month, year and JP locale', () => {
+ const { container } = render(
+ <DateLocale year={2012} month={4} locale={new Locale('jp', 'JP')} />
+ )
+ expect(container).toHaveTextContent('２０１２business-card-year-singularbusiness-card-month-4')
+})
 
-new Array<DateLocaleFixture>({
- title: 'JP',
- locale: 'jp',
- expect: (toDoubleByteSpy, year) => {
- expect(tMock).toHaveBeenCalledTimes(1)
- expect(tMock).toHaveBeenCalledWith('business-card-year-singular')
- expect(tMock).not.toHaveBeenCalledWith(expect.stringMatching(/^business-card-month-.*$/))
- expect(toDoubleByteSpy).toHaveBeenCalledWith(year.toString())
- }
-}, {
- title: 'non-JP',
- locale: 'gb',
- expect: (toDoubleByteSpy, year) => {
- expect(tMock).not.toHaveBeenCalled()
- expect(toDoubleByteSpy).not.toHaveBeenCalled()
- }
-}).forEach((f) =>
- test(`should render DateLocale without month in ${f.title} locale correctly`, () => {
- const year = 2019
- tMock.mockImplementation((k) => `${f.locale}-${k}`)
- const toDoubleByteSpy = jest.fn((k) => k)
- const wrapper: ShallowWrapper = shallow(
- <DateLocale
- converter={{
- _convert: null,
- toDoubleByte: toDoubleByteSpy,
- toSingleByte: null
- }}
- locale={{
- code: f.locale,
- title: ''
- }}
- year={year}
- />
- )
- expect(wrapper).toMatchSnapshot()
- f.expect(toDoubleByteSpy, year)
- })
-)
+test('should render correctly with year and JP locale', () => {
+ const { container } = render(
+ <DateLocale year={2002} locale={new Locale('jp', 'JP')} />
+ )
+ expect(container).toHaveTextContent('２００２business-card-year-singular')
+})

src/components/Education/EducationItem.tsx

@@ -13,7 +13,7 @@ export default function EducationItem(props: EducationItemProps) {
  return (
  <>
  <div className="timeline-image">
- <h4><DateLocale year={props.to} />-<br /><DateLocale year={props.from} /></h4>
+ <h4><DateLocale year={props.to} /><br />-<br /><DateLocale year={props.from} /></h4>
  </div>
  <div className="timeline-panel">
  <div className="timeline-heading">