simorgh/src/app/hooks/useUASButton/index.test.tsx at 64b0f38e1e99f5ec8e9b58175e94bfab2d6c1358 · bbc/simorgh · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
import { renderHook } from '#app/components/react-testing-library-with-providers';
import useFetchSaveStatus from '#app/hooks/useUASFetchSaveStatus';
import isLocal from '#app/lib/utilities/isLocal';
import useUASButton from './index';

import useToggle from '../useToggle';

jest.mock('#app/hooks/useUASFetchSaveStatus');
jest.mock('../useToggle');
jest.mock('#app/lib/utilities/isLocal');

const mockUseFetchSaveStatus = useFetchSaveStatus as jest.Mock;
const mockUseToggle = useToggle as jest.Mock;
const mockIsLocal = isLocal as jest.Mock;

describe('useUASButton', () => {
  const defaultProps = {
    isSignedIn: true,
    articleId: '123',
    service: 'hindi',
  };

  afterEach(() => {
    jest.clearAllMocks();
  });

  test('returns showButton = false when feature toggle is off', () => {
    mockUseToggle.mockReturnValue({ enabled: false });
    mockIsLocal.mockReturnValue(false);

    mockUseFetchSaveStatus.mockReturnValue({
      isSaved: false,
      loading: false,
      error: null,
    });

    const { result } = renderHook(() => useUASButton(defaultProps));

    expect(result.current.showButton).toBe(false);
  });

  test('returns showButton = false when user is not signed in', () => {
    mockUseToggle.mockReturnValue({ enabled: true });
    mockIsLocal.mockReturnValue(false);

    const { result } = renderHook(() =>
      useUASButton({ ...defaultProps, isSignedIn: false }),
    );

    expect(result.current.showButton).toBe(false);
  });

  test('returns showButton = true when feature enabled and signed in', () => {
    mockUseToggle.mockReturnValue({ enabled: true });
    mockIsLocal.mockReturnValue(false);

    mockUseFetchSaveStatus.mockReturnValue({
      isSaved: true,
      loading: false,
      error: null,
    });

    const { result } = renderHook(() => useUASButton(defaultProps));

    expect(result.current.showButton).toBe(true);
  });

  test('passes articleId to useFetchSaveStatus when showButton is true', () => {
    mockUseToggle.mockReturnValue({ enabled: true });
    mockIsLocal.mockReturnValue(false);

    mockUseFetchSaveStatus.mockReturnValue({
      isSaved: false,
      loading: false,
      error: null,
    });

    renderHook(() => useUASButton(defaultProps));

    expect(mockUseFetchSaveStatus).toHaveBeenCalledWith('123');
  });

  test('passes empty string when showButton is false', () => {
    mockUseToggle.mockReturnValue({ enabled: false });
    mockIsLocal.mockReturnValue(false);

    renderHook(() => useUASButton(defaultProps));

    expect(mockUseFetchSaveStatus).toHaveBeenCalledWith('');
  });

  test('respects local environment service filtering', () => {
    mockUseToggle.mockReturnValue({
      enabled: true,
      value: 'hindi|sport',
    });
    mockIsLocal.mockReturnValue(true);

    mockUseFetchSaveStatus.mockReturnValue({
      isSaved: false,
      loading: false,
      error: null,
    });

    const { result } = renderHook(() => useUASButton(defaultProps));

    expect(result.current.showButton).toBe(true);
  });

  test('hides button if service not in toggle value in local', () => {
    mockUseToggle.mockReturnValue({
      enabled: true,
      value: 'mundo',
    });
    mockIsLocal.mockReturnValue(true);

    const { result } = renderHook(() => useUASButton(defaultProps));

    expect(result.current.showButton).toBe(false);
  });
});