tests: add maestro and unit testing (#108)

* tests: add maestro test on Search and Movie

* feat: change icon

* tests: add maestro tests and unit tests

* tests: add tests on utils

* tests: edit name of maestro screenshots

__tests__/Movie.test.tsx

@@ -1,20 +1,60 @@
 import Movie from 'app/movie/[id]';
 
-import { MOCK_MOVIE } from 'api/__mocks__/movie';
+import { MOCK_LOGO, MOCK_LOGO_EMPTY } from 'api/__mocks__/logo';
+import { MOCK_MOVIE, MOCK_MOVIE_WITH_NETWORK } from 'api/__mocks__/movie';
 
+import * as logo from '../src/api/logo';
 import * as movie from '../src/api/movie';
-import { render, screen } from '../tests/render';
+import { mockQuery, render, screen } from '../tests/render';
 
 describe('<Movie />', () => {
-  test('Text renders correctly on HomeScreen', () => {
+  test('should render correctly', () => {
+    jest.spyOn(movie, 'useGetMovie').mockReturnValue(mockQuery(MOCK_MOVIE));
+    jest.spyOn(logo, 'useGetContentLogo').mockReturnValue(mockQuery(MOCK_LOGO));
+
+    render(<Movie />);
+
+    expect(screen.getByTestId('release-date')).toHaveTextContent(
+      'November 16, 2001'
+    );
+    expect(screen.getByTestId('runtime')).toHaveTextContent('2h32m');
+    expect(screen.getByTestId('votes')).toHaveTextContent('7.9 (26908)');
+    expect(screen.queryByTestId('network-1234')).toBeFalsy();
+    expect(screen.queryByTestId('subtitle')).toHaveTextContent(
+      'Adventure - Fantasy'
+    );
+    expect(screen.queryByTestId('cover-title')).toBeFalsy();
+    expect(screen.queryByTestId('cover-image')).toHaveProp('source', {
+      uri: 'https://image.tmdb.org/t/p/w780/hziiv14OpD73u9gAak4XDDfBKa2.jpg'
+    });
+    expect(screen.queryByTestId('cover-logo')).toHaveProp(
+      'src',
+      'https://image.tmdb.org/t/p/w500url-logo.png'
+    );
+  });
+
+  test('should render correctly with network', () => {
     jest
       .spyOn(movie, 'useGetMovie')
-      .mockReturnValue(MOCK_MOVIE as movie.UseMovie);
+      .mockReturnValue(mockQuery(MOCK_MOVIE_WITH_NETWORK));
+    jest.spyOn(logo, 'useGetContentLogo').mockReturnValue(mockQuery(MOCK_LOGO));
 
     render(<Movie />);
 
-    const textLabel = screen.getByTestId('release-date');
+    expect(screen.getByTestId('network-213')).toBeTruthy();
+  });
+
+  test('should render correctly without logo', () => {
+    jest.spyOn(movie, 'useGetMovie').mockReturnValue(mockQuery(MOCK_MOVIE));
+    jest
+      .spyOn(logo, 'useGetContentLogo')
+      .mockReturnValue(mockQuery(MOCK_LOGO_EMPTY));
+
+    render(<Movie />);
 
-    expect(textLabel).toHaveTextContent('June 20, 2024');
+    expect(screen.queryByTestId('cover-title')).toHaveTextContent(
+      "Harry Potter and the Philosopher's Stone"
+    );
+    expect(screen.queryByTestId('cover-logo')).toBeFalsy();
   });
 });

__tests__/person.test.tsx

@@ -0,0 +1,55 @@
+import Person from 'app/person/[id]';
+
+import {
+  MOCK_PERSON,
+  MOCK_PERSON_MOVIES,
+  MOCK_PERSON_TV
+} from 'api/__mocks__/person';
+
+import * as person from '../src/api/person';
+import { mockQuery, render, screen } from '../tests/render';
+
+describe('<Person />', () => {
+  test('should render correctly', () => {
+    jest.spyOn(person, 'useGetPerson').mockReturnValue(mockQuery(MOCK_PERSON));
+    jest
+      .spyOn(person, 'useGetPersonMovieCredits')
+      .mockReturnValue(mockQuery(MOCK_PERSON_MOVIES));
+    jest
+      .spyOn(person, 'useGetPersonTvCredits')
+      .mockReturnValue(mockQuery(MOCK_PERSON_TV));
+
+    render(<Person />);
+
+    expect(screen.getByTestId('department')).toHaveTextContent('Acting');
+    expect(screen.getByTestId('birthday')).toHaveTextContent(
+      'Born on July 23, 1989 (35y)'
+    );
+    expect(screen.getByTestId('place-of-birth')).toHaveTextContent(
+      'Hammersmith, London, England, UK'
+    );
+    expect(screen.getByTestId('movies')).toHaveTextContent('1 movie');
+    expect(screen.getByTestId('series')).toHaveTextContent('1 serie');
+    expect(screen.queryByTestId('cover-title')).toHaveTextContent(
+      'Daniel Radcliffe'
+    );
+    expect(screen.queryByTestId('cover-image')).toHaveProp('source', {
+      uri: 'https://image.tmdb.org/t/p/w780/iPg0J9UzAlPj1fLEJNllpW9IhGe.jpg'
+    });
+  });
+
+  test('should render correctly with deathday', () => {
+    jest
+      .spyOn(person, 'useGetPerson')
+      .mockReturnValue(mockQuery({ ...MOCK_PERSON, deathday: '2024-07-23' }));
+
+    render(<Person />);
+
+    expect(screen.getByTestId('birthday')).toHaveTextContent(
+      'Born on July 23, 1989'
+    );
+    expect(screen.getByTestId('deathday')).toHaveTextContent(
+      'Died on July 23, 2024 (35y)'
+    );
+  });
+});

__tests__/tv.test.tsx

@@ -0,0 +1,56 @@
+import Tv from 'app/tv/[id]';
+
+import { MOCK_LOGO, MOCK_LOGO_EMPTY } from 'api/__mocks__/logo';
+import { MOCK_TV, MOCK_TV_WITH_NETWORK } from 'api/__mocks__/tv';
+
+import * as logo from '../src/api/logo';
+import * as tv from '../src/api/tv';
+import { mockQuery, render, screen } from '../tests/render';
+
+describe('<Tv />', () => {
+  test('should render correctly', () => {
+    jest.spyOn(tv, 'useGetTv').mockReturnValue(mockQuery(MOCK_TV));
+    jest.spyOn(logo, 'useGetContentLogo').mockReturnValue(mockQuery(MOCK_LOGO));
+
+    render(<Tv />);
+
+    expect(screen.getByTestId('release-date')).toHaveTextContent('2022 - 2024');
+    expect(screen.getByTestId('runtime')).toHaveTextContent('1h8m');
+    expect(screen.getByTestId('votes')).toHaveTextContent('8.4 (4773)');
+    expect(screen.queryByTestId('network-1234')).toBeFalsy();
+    expect(screen.queryByTestId('subtitle')).toHaveTextContent(
+      'Sci-Fi & Fantasy - Drama'
+    );
+    expect(screen.queryByTestId('cover-title')).toBeFalsy();
+    expect(screen.queryByTestId('cover-image')).toHaveProp('source', {
+      uri: 'https://image.tmdb.org/t/p/w780/etj8E2o0Bud0HkONVQPjyCkIvpv.jpg'
+    });
+    expect(screen.queryByTestId('cover-logo')).toHaveProp(
+      'src',
+      'https://image.tmdb.org/t/p/w500url-logo.png'
+    );
+  });
+
+  test('should render correctly with network', () => {
+    jest.spyOn(tv, 'useGetTv').mockReturnValue(mockQuery(MOCK_TV_WITH_NETWORK));
+    jest.spyOn(logo, 'useGetContentLogo').mockReturnValue(mockQuery(MOCK_LOGO));
+
+    render(<Tv />);
+
+    expect(screen.getByTestId('network-49')).toBeTruthy();
+  });
+
+  test('should render correctly without logo', () => {
+    jest.spyOn(tv, 'useGetTv').mockReturnValue(mockQuery(MOCK_TV));
+    jest
+      .spyOn(logo, 'useGetContentLogo')
+      .mockReturnValue(mockQuery(MOCK_LOGO_EMPTY));
+
+    render(<Tv />);
+
+    expect(screen.queryByTestId('cover-title')).toHaveTextContent(
+      'House of the Dragon'
+    );
+    expect(screen.queryByTestId('cover-logo')).toBeFalsy();
+  });
+});

maestro/discover.yml

@@ -0,0 +1,52 @@
+appId: com.theomesnil.WhatToWatch
+---
+- launchApp
+- waitForAnimationToEnd
+- takeScreenshot: 'maestro/screenshots/discover/index'
+- tapOn: 'Discover'
+- tapOn:
+    id: 'header-back-button'
+- tapOn:
+    point: '14%,79%'
+- tapOn:
+    id: 'header-back-button'
+- scroll
+- takeScreenshot: 'maestro/screenshots/discover/index2'
+- tapOn: '1'
+- tapOn:
+    id: 'header-back-button'
+- tapOn:
+    point: '18%,52%'
+- tapOn:
+    id: 'header-back-button'
+- tapOn: 'Action Action'
+- tapOn:
+    id: 'header-back-button'
+- scroll
+- takeScreenshot: 'maestro/screenshots/discover/index3'
+- tapOn:
+    point: '33%,28%'
+- tapOn:
+    id: 'header-back-button'
+- tapOn: '1'
+- tapOn:
+    id: 'header-back-button'
+- tapOn:
+    point: '18%,84%'
+- tapOn:
+    id: 'header-back-button'
+- scroll
+- takeScreenshot: 'maestro/screenshots/discover/index4'
+- tapOn: 'Action & Adventure Action & Adventure'
+- tapOn:
+    id: 'header-back-button'
+- scroll
+- takeScreenshot: 'maestro/screenshots/discover/index5'
+- tapOn:
+    point: '33%,48%'
+- tapOn:
+    id: 'header-back-button'
+- tapOn:
+    point: '18%,78%'
+- tapOn:
+    id: 'header-back-button'

maestro/genre.yml

@@ -0,0 +1,35 @@
+appId: com.theomesnil.WhatToWatch
+---
+- launchApp
+- scroll
+- scroll
+- tapOn: 'Action Action'
+- takeScreenshot: 'maestro/screenshots/genre/movie'
+- tapOn:
+    point: '50%,31%'
+- tapOn:
+    id: 'header-back-button'
+- scroll
+- takeScreenshot: 'maestro/screenshots/genre/movie2'
+- tapOn:
+    point: '19%,26%'
+- tapOn:
+    id: 'header-back-button'
+- tapOn:
+    id: 'header-back-button'
+- scroll
+- scroll
+- tapOn: 'Action & Adventure Action & Adventure'
+- takeScreenshot: 'maestro/screenshots/genre/tv'
+- tapOn:
+    point: '50%,31%'
+- tapOn:
+    id: 'header-back-button'
+- scroll
+- takeScreenshot: 'maestro/screenshots/genre/tv2'
+- tapOn:
+    point: '19%,26%'
+- tapOn:
+    id: 'header-back-button'
+- tapOn:
+    id: 'header-back-button'

maestro/movie.yml

@@ -2,6 +2,40 @@ appId: com.theomesnil.WhatToWatch
 ---
 - launchApp
 - tapOn: 'Search, tab, 2 of 3'
-- waitForAnimationToEnd:
-    timeout: 5000
-- takeScreenshot: 'maestro/screenshots/Search'
+- tapOn: 'What would you like to watch?'
+- inputText: 'Harry potter philosopher'
+- doubleTapOn: "Harry Potter and the Philosopher's Stone"
+- waitForAnimationToEnd
+- takeScreenshot: 'maestro/screenshots/movie/index'
+- tapOn: 'Watch the trailer'
+- assertVisible:
+    id: 'video'
+- takeScreenshot: 'maestro/screenshots/movie/trailer'
+- tapOn:
+    id: 'header-close-button'
+- scroll
+- takeScreenshot: 'maestro/screenshots/movie/index2'
+- tapOn: 'Daniel Radcliffe Harry Potter'
+- assertVisible: 'Daniel Radcliffe'
+- tapOn:
+    id: 'header-back-button'
+- tapOn: 'Official Trailer'
+- takeScreenshot: 'maestro/screenshots/movie/video'
+- tapOn:
+    id: 'header-close-button'
+- scroll
+- takeScreenshot: 'maestro/screenshots/movie/index3'
+- tapOn: 'Backdrops'
+- swipe:
+    direction: LEFT
+- takeScreenshot: 'maestro/screenshots/movie/backdrops'
+- tapOn:
+    id: 'header-close-button'
+- tapOn: 'Posters'
+- swipe:
+    direction: LEFT
+- takeScreenshot: 'maestro/screenshots/movie/posters'
+- tapOn:
+    id: 'header-close-button'
+- tapOn:
+    id: 'header-back-button'

maestro/network.yml

@@ -0,0 +1,21 @@
+appId: com.theomesnil.WhatToWatch
+---
+- launchApp
+- tapOn: 'Streaming, tab, 3 of 3'
+- waitForAnimationToEnd
+- takeScreenshot: 'maestro/screenshots/network/streaming'
+- scroll
+- takeScreenshot: 'maestro/screenshots/network/streaming2'
+- tapOn:
+    point: '18%,78%'
+- takeScreenshot: 'maestro/screenshots/network/index'
+- tapOn:
+    point: '50%,31%'
+- assertVisible: '2 seasons'
+- tapOn:
+    id: 'header-back-button'
+- scroll
+- takeScreenshot: 'maestro/screenshots/network/index2'
+- tapOn:
+    point: '50%,28%'
+- assertVisible: '7 seasons'

maestro/person.yml

@@ -0,0 +1,35 @@
+appId: com.theomesnil.WhatToWatch
+---
+- launchApp
+- tapOn: 'Search, tab, 2 of 3'
+- tapOn: 'What would you like to watch?'
+- inputText: 'Daniel Radcliffe'
+- doubleTapOn:
+    point: '19%,38%'
+- waitForAnimationToEnd
+- takeScreenshot: 'maestro/screenshots/person/index'
+- scroll
+- takeScreenshot: 'maestro/screenshots/person/index2'
+- tapOn:
+    point: '25%,42%'
+- takeScreenshot: 'maestro/screenshots/person/know-for'
+- tapOn:
+    id: 'header-back-button'
+- tapOn:
+    id: 'credits-movie'
+- takeScreenshot: 'maestro/screenshots/person/movies'
+- tapOn:
+    id: 'header-back-button'
+- tapOn:
+    id: 'credits-tv'
+- takeScreenshot: 'maestro/screenshots/person/series'
+- tapOn:
+    id: 'header-back-button'
+- tapOn:
+    point: '18%,85%'
+- swipe:
+    direction: LEFT
+- takeScreenshot: 'maestro/screenshots/person/pictures'
+- tapOn:
+    id: 'header-close-button'
+- assertVisible: 'Pictures'