From 9a79c5405d3c1199b91bb387093b762966bd9985 Mon Sep 17 00:00:00 2001
From: Bill Thornton <billt2006@gmail.com>
Date: Tue, 29 Mar 2022 02:51:33 -0400
Subject: [PATCH] Add SettingsScreen test

---
 jest.setup.js                                 |   4 +
 screens/__tests__/SettingsScreen.test.js      |  47 ++
 .../__snapshots__/SettingsScreen.test.js.snap | 745 ++++++++++++++++++
 3 files changed, 796 insertions(+)
 create mode 100644 screens/__tests__/SettingsScreen.test.js
 create mode 100644 screens/__tests__/__snapshots__/SettingsScreen.test.js.snap

diff --git a/jest.setup.js b/jest.setup.js
index 4c49ab9..6b17417 100644
--- a/jest.setup.js
+++ b/jest.setup.js
@@ -4,6 +4,10 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
+/* AsyncStorage Mock */
+import mockAsyncStorage from '@react-native-async-storage/async-storage/jest/async-storage-mock';
+jest.mock('@react-native-async-storage/async-storage', () => mockAsyncStorage);
+
 /* Fetch and AbortController Mocks */
 import { enableFetchMocks } from 'jest-fetch-mock';
 import { AbortController } from 'node-abort-controller';
diff --git a/screens/__tests__/SettingsScreen.test.js b/screens/__tests__/SettingsScreen.test.js
new file mode 100644
index 0000000..6030e06
--- /dev/null
+++ b/screens/__tests__/SettingsScreen.test.js
@@ -0,0 +1,47 @@
+/**
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+import { NavigationContainer } from '@react-navigation/native';
+import { render } from '@testing-library/react-native';
+import React from 'react';
+import { Platform } from 'react-native';
+import { ThemeProvider } from 'react-native-elements';
+
+import '../../i18n';
+import { useStores } from '../../hooks/useStores';
+import SettingsScreen from '../SettingsScreen';
+
+// Mock Platform to allow testing platform specific code
+jest.mock('react-native/Libraries/Utilities/Platform');
+// Button fails to render in some cases so it needs mocked
+jest.mock('react-native-elements/dist/buttons/Button', () => 'Button');
+
+jest.mock('../../hooks/useStores');
+useStores.mockImplementation(() => ({
+	rootStore: {
+		serverStore: {
+			fetchInfo: jest.fn(),
+			servers: []
+		},
+		settingStore: {}
+	}
+}));
+
+describe('SettingsScreen', () => {
+	it('should render correctly', () => {
+		Platform.Version = '13';
+
+		const { toJSON } = render(
+			<ThemeProvider>
+				<NavigationContainer>
+					<SettingsScreen />
+				</NavigationContainer>
+			</ThemeProvider>
+		);
+
+		expect(toJSON()).toMatchSnapshot();
+	});
+});
diff --git a/screens/__tests__/__snapshots__/SettingsScreen.test.js.snap b/screens/__tests__/__snapshots__/SettingsScreen.test.js.snap
new file mode 100644
index 0000000..1ce28cb
--- /dev/null
+++ b/screens/__tests__/__snapshots__/SettingsScreen.test.js.snap
@@ -0,0 +1,745 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`SettingsScreen should render correctly 1`] = `
+<RNCSafeAreaView
+  edges={
+    Array [
+      "right",
+      "left",
+    ]
+  }
+  style={
+    Object {
+      "backgroundColor": undefined,
+      "flex": 1,
+    }
+  }
+>
+  <RCTScrollView
+    ListFooterComponent={[Function]}
+    data={
+      Array [
+        Object {
+          "data": Array [],
+          "keyExtractor": [Function],
+          "renderItem": [Function],
+          "title": "Servers",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "key": "add-server-button",
+              "onPress": [Function],
+              "title": "Add Server",
+            },
+          ],
+          "hideHeader": true,
+          "renderItem": [Function],
+          "title": "Add Server",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "key": "keep-awake-switch",
+              "onValueChange": [Function],
+              "title": "Keep Screen Awake",
+              "value": undefined,
+            },
+            Object {
+              "key": "rotation-lock-switch",
+              "onValueChange": [Function],
+              "title": "Rotation Lock",
+              "value": undefined,
+            },
+          ],
+          "renderItem": [Function],
+          "title": "Settings",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "badge": Object {
+                "value": "BETA",
+              },
+              "key": "native-video-switch",
+              "onValueChange": [Function],
+              "subtitle": "Requires Server Version 10.7+",
+              "title": "Use Native Video Player",
+              "value": undefined,
+            },
+            Object {
+              "disabled": true,
+              "key": "native-video-fmp4-switch",
+              "onValueChange": [Function],
+              "title": "Prefer fMP4 in HLS",
+              "value": undefined,
+            },
+          ],
+          "renderItem": [Function],
+          "title": "Playback",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "key": "tab-labels-switch",
+              "onValueChange": [Function],
+              "title": "Show Tab Labels",
+              "value": undefined,
+            },
+            Object {
+              "key": "system-theme-switch",
+              "onValueChange": [Function],
+              "title": "Use System Theme",
+              "value": undefined,
+            },
+            Object {
+              "disabled": undefined,
+              "key": "theme-switch",
+              "onValueChange": [Function],
+              "title": "Use Light Theme",
+              "value": false,
+            },
+          ],
+          "renderItem": [Function],
+          "title": "Appearance",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "icon": Object {
+                "name": "ios-globe-outline",
+                "type": "ionicon",
+              },
+              "key": "links-website",
+              "name": "Jellyfin Website",
+              "url": "https://jellyfin.org/",
+            },
+            Object {
+              "icon": Object {
+                "name": "ios-book",
+                "type": "ionicon",
+              },
+              "key": "links-documentation",
+              "name": "Documentation",
+              "url": "https://docs.jellyfin.org",
+            },
+            Object {
+              "icon": Object {
+                "name": "logo-github",
+                "type": "ionicon",
+              },
+              "key": "links-source",
+              "name": "Source Code",
+              "url": "https://github.com/jellyfin/jellyfin-expo",
+            },
+            Object {
+              "icon": Object {
+                "name": "translate",
+                "type": "material",
+              },
+              "key": "links-translate",
+              "name": "Translate",
+              "url": "https://translate.jellyfin.org/projects/jellyfin/jellyfin-expo/",
+            },
+            Object {
+              "icon": Object {
+                "name": "ios-bug",
+                "type": "ionicon",
+              },
+              "key": "links-issue",
+              "name": "Report an Issue",
+              "url": "https://github.com/jellyfin/jellyfin-expo/issues",
+            },
+          ],
+          "renderItem": [Function],
+          "title": "Links",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "key": "reset-app-button",
+              "onPress": [Function],
+              "title": "Reset Application",
+              "titleStyle": Object {
+                "color": "#ff190c",
+              },
+            },
+          ],
+          "hideHeader": true,
+          "renderItem": [Function],
+          "title": "Reset Application",
+        },
+      ]
+    }
+    disableVirtualization={false}
+    extraData={
+      Object {
+        "activeServer": undefined,
+        "isFetching": undefined,
+      }
+    }
+    getItem={[Function]}
+    getItemCount={[Function]}
+    horizontal={false}
+    initialNumToRender={10}
+    keyExtractor={[Function]}
+    maxToRenderPerBatch={10}
+    onContentSizeChange={[Function]}
+    onEndReachedThreshold={2}
+    onLayout={[Function]}
+    onMomentumScrollEnd={[Function]}
+    onScroll={[Function]}
+    onScrollBeginDrag={[Function]}
+    onScrollEndDrag={[Function]}
+    renderItem={[Function]}
+    scrollEventThrottle={50}
+    showsVerticalScrollIndicator={false}
+    stickyHeaderIndices={
+      Array [
+        0,
+        2,
+        5,
+        9,
+      ]
+    }
+    updateCellsBatchingPeriod={50}
+    windowSize={21}
+  >
+    <View>
+      <View
+        onLayout={[Function]}
+        style={null}
+      />
+      <View
+        onLayout={[Function]}
+        style={null}
+      />
+      <View
+        onLayout={[Function]}
+        style={null}
+      >
+        <View
+          style={
+            Object {
+              "marginTop": 15,
+            }
+          }
+        />
+      </View>
+      <View
+        onLayout={[Function]}
+        style={null}
+      >
+        <View
+          replaceTheme={[Function]}
+          updateTheme={[Function]}
+        >
+          <View
+            style={
+              Object {
+                "alignItems": "center",
+                "backgroundColor": "#ffffff",
+                "borderBottomWidth": 0.5,
+                "borderColor": "#bcbbc1",
+                "borderTopWidth": 0.5,
+                "flexDirection": "row",
+              }
+            }
+            testID="padView"
+          >
+            <View
+              replaceTheme={[Function]}
+              style={
+                Array [
+                  Object {
+                    "alignItems": "flex-start",
+                    "flex": 1,
+                    "justifyContent": "center",
+                  },
+                  undefined,
+                ]
+              }
+              theme={
+                Object {
+                  "colors": Object {
+                    "black": "#242424",
+                    "disabled": "hsl(208, 8%, 90%)",
+                    "divider": "#bcbbc1",
+                    "error": "#ff190c",
+                    "grey0": "#393e42",
+                    "grey1": "#43484d",
+                    "grey2": "#5e6977",
+                    "grey3": "#86939e",
+                    "grey4": "#bdc6cf",
+                    "grey5": "#e1e8ee",
+                    "greyOutline": "#bbb",
+                    "platform": Object {
+                      "android": Object {
+                        "error": "#f44336",
+                        "grey": "rgba(0, 0, 0, 0.54)",
+                        "primary": "#2196f3",
+                        "searchBg": "#dcdce1",
+                        "secondary": "#9C27B0",
+                        "success": "#4caf50",
+                        "warning": "#ffeb3b",
+                      },
+                      "default": Object {
+                        "error": "#ff3b30",
+                        "grey": "#7d7d7d",
+                        "primary": "#007aff",
+                        "searchBg": "#dcdce1",
+                        "secondary": "#5856d6",
+                        "success": "#4cd964",
+                        "warning": "#ffcc00",
+                      },
+                      "ios": Object {
+                        "error": "#ff3b30",
+                        "grey": "#7d7d7d",
+                        "primary": "#007aff",
+                        "searchBg": "#dcdce1",
+                        "secondary": "#5856d6",
+                        "success": "#4cd964",
+                        "warning": "#ffcc00",
+                      },
+                      "web": Object {
+                        "error": "#ff190c",
+                        "grey": "#393e42",
+                        "primary": "#2089dc",
+                        "searchBg": "#303337",
+                        "secondary": "#ca71eb",
+                        "success": "#52c41a",
+                        "warning": "#faad14",
+                      },
+                    },
+                    "primary": "#2089dc",
+                    "searchBg": "#303337",
+                    "secondary": "#ca71eb",
+                    "success": "#52c41a",
+                    "warning": "#faad14",
+                    "white": "#ffffff",
+                  },
+                }
+              }
+              updateTheme={[Function]}
+            >
+              <Button
+                buttonStyle={
+                  Object {
+                    "padding": 0,
+                  }
+                }
+                onPress={[Function]}
+                testID="button"
+                title="Add Server"
+                titleStyle={
+                  Object {
+                    "textAlign": "auto",
+                    "width": "100%",
+                  }
+                }
+                type="clear"
+              />
+            </View>
+          </View>
+        </View>
+      </View>
+      <View
+        onLayout={[Function]}
+        style={null}
+      >
+        <View
+          style={
+            Object {
+              "marginBottom": 15,
+            }
+          }
+        />
+      </View>
+      <View
+        onLayout={[Function]}
+        style={null}
+      >
+        <Text
+          style={
+            Object {
+              "backgroundColor": undefined,
+              "color": "#43484d",
+              "fontWeight": "600",
+              "marginBottom": 1,
+              "paddingHorizontal": 15,
+              "paddingVertical": 8,
+            }
+          }
+        >
+          Settings
+        </Text>
+      </View>
+      <View
+        onLayout={[Function]}
+        style={null}
+      >
+        <View
+          replaceTheme={[Function]}
+          testID="switch-list-item"
+          updateTheme={[Function]}
+        >
+          <View
+            style={
+              Object {
+                "alignItems": "center",
+                "backgroundColor": "#ffffff",
+                "borderBottomWidth": 0.5,
+                "borderColor": "#bcbbc1",
+                "borderTopWidth": 0.5,
+                "flexDirection": "row",
+              }
+            }
+            testID="padView"
+          >
+            <View
+              replaceTheme={[Function]}
+              style={
+                Array [
+                  Object {
+                    "alignItems": "flex-start",
+                    "flex": 1,
+                    "justifyContent": "center",
+                  },
+                  undefined,
+                ]
+              }
+              theme={
+                Object {
+                  "colors": Object {
+                    "black": "#242424",
+                    "disabled": "hsl(208, 8%, 90%)",
+                    "divider": "#bcbbc1",
+                    "error": "#ff190c",
+                    "grey0": "#393e42",
+                    "grey1": "#43484d",
+                    "grey2": "#5e6977",
+                    "grey3": "#86939e",
+                    "grey4": "#bdc6cf",
+                    "grey5": "#e1e8ee",
+                    "greyOutline": "#bbb",
+                    "platform": Object {
+                      "android": Object {
+                        "error": "#f44336",
+                        "grey": "rgba(0, 0, 0, 0.54)",
+                        "primary": "#2196f3",
+                        "searchBg": "#dcdce1",
+                        "secondary": "#9C27B0",
+                        "success": "#4caf50",
+                        "warning": "#ffeb3b",
+                      },
+                      "default": Object {
+                        "error": "#ff3b30",
+                        "grey": "#7d7d7d",
+                        "primary": "#007aff",
+                        "searchBg": "#dcdce1",
+                        "secondary": "#5856d6",
+                        "success": "#4cd964",
+                        "warning": "#ffcc00",
+                      },
+                      "ios": Object {
+                        "error": "#ff3b30",
+                        "grey": "#7d7d7d",
+                        "primary": "#007aff",
+                        "searchBg": "#dcdce1",
+                        "secondary": "#5856d6",
+                        "success": "#4cd964",
+                        "warning": "#ffcc00",
+                      },
+                      "web": Object {
+                        "error": "#ff190c",
+                        "grey": "#393e42",
+                        "primary": "#2089dc",
+                        "searchBg": "#303337",
+                        "secondary": "#ca71eb",
+                        "success": "#52c41a",
+                        "warning": "#faad14",
+                      },
+                    },
+                    "primary": "#2089dc",
+                    "searchBg": "#303337",
+                    "secondary": "#ca71eb",
+                    "success": "#52c41a",
+                    "warning": "#faad14",
+                    "white": "#ffffff",
+                  },
+                }
+              }
+              updateTheme={[Function]}
+            >
+              <View
+                style={
+                  Object {
+                    "flexDirection": "row",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    Object {
+                      "backgroundColor": "transparent",
+                      "color": "#242424",
+                    }
+                  }
+                  testID="title"
+                >
+                  Keep Screen Awake
+                </Text>
+              </View>
+            </View>
+            <View
+              style={
+                Object {
+                  "paddingLeft": 16,
+                }
+              }
+            />
+            <RCTSwitch
+              accessibilityRole="switch"
+              onChange={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                Object {
+                  "height": 31,
+                  "width": 51,
+                }
+              }
+              testID="switch"
+              value={false}
+            />
+          </View>
+        </View>
+      </View>
+      <View
+        onLayout={[Function]}
+        style={null}
+      >
+        <View
+          replaceTheme={[Function]}
+          testID="switch-list-item"
+          updateTheme={[Function]}
+        >
+          <View
+            style={
+              Object {
+                "alignItems": "center",
+                "backgroundColor": "#ffffff",
+                "borderBottomWidth": 0.5,
+                "borderColor": "#bcbbc1",
+                "flexDirection": "row",
+              }
+            }
+            testID="padView"
+          >
+            <View
+              replaceTheme={[Function]}
+              style={
+                Array [
+                  Object {
+                    "alignItems": "flex-start",
+                    "flex": 1,
+                    "justifyContent": "center",
+                  },
+                  undefined,
+                ]
+              }
+              theme={
+                Object {
+                  "colors": Object {
+                    "black": "#242424",
+                    "disabled": "hsl(208, 8%, 90%)",
+                    "divider": "#bcbbc1",
+                    "error": "#ff190c",
+                    "grey0": "#393e42",
+                    "grey1": "#43484d",
+                    "grey2": "#5e6977",
+                    "grey3": "#86939e",
+                    "grey4": "#bdc6cf",
+                    "grey5": "#e1e8ee",
+                    "greyOutline": "#bbb",
+                    "platform": Object {
+                      "android": Object {
+                        "error": "#f44336",
+                        "grey": "rgba(0, 0, 0, 0.54)",
+                        "primary": "#2196f3",
+                        "searchBg": "#dcdce1",
+                        "secondary": "#9C27B0",
+                        "success": "#4caf50",
+                        "warning": "#ffeb3b",
+                      },
+                      "default": Object {
+                        "error": "#ff3b30",
+                        "grey": "#7d7d7d",
+                        "primary": "#007aff",
+                        "searchBg": "#dcdce1",
+                        "secondary": "#5856d6",
+                        "success": "#4cd964",
+                        "warning": "#ffcc00",
+                      },
+                      "ios": Object {
+                        "error": "#ff3b30",
+                        "grey": "#7d7d7d",
+                        "primary": "#007aff",
+                        "searchBg": "#dcdce1",
+                        "secondary": "#5856d6",
+                        "success": "#4cd964",
+                        "warning": "#ffcc00",
+                      },
+                      "web": Object {
+                        "error": "#ff190c",
+                        "grey": "#393e42",
+                        "primary": "#2089dc",
+                        "searchBg": "#303337",
+                        "secondary": "#ca71eb",
+                        "success": "#52c41a",
+                        "warning": "#faad14",
+                      },
+                    },
+                    "primary": "#2089dc",
+                    "searchBg": "#303337",
+                    "secondary": "#ca71eb",
+                    "success": "#52c41a",
+                    "warning": "#faad14",
+                    "white": "#ffffff",
+                  },
+                }
+              }
+              updateTheme={[Function]}
+            >
+              <View
+                style={
+                  Object {
+                    "flexDirection": "row",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    Object {
+                      "backgroundColor": "transparent",
+                      "color": "#242424",
+                    }
+                  }
+                  testID="title"
+                >
+                  Rotation Lock
+                </Text>
+              </View>
+            </View>
+            <View
+              style={
+                Object {
+                  "paddingLeft": 16,
+                }
+              }
+            />
+            <RCTSwitch
+              accessibilityRole="switch"
+              onChange={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                Object {
+                  "height": 31,
+                  "width": 51,
+                }
+              }
+              testID="switch"
+              value={false}
+            />
+          </View>
+        </View>
+      </View>
+      <View
+        onLayout={[Function]}
+        style={null}
+      >
+        <View
+          style={
+            Object {
+              "marginBottom": 15,
+            }
+          }
+        />
+      </View>
+      <View
+        onLayout={[Function]}
+        style={null}
+      >
+        <Text
+          style={
+            Object {
+              "backgroundColor": undefined,
+              "color": "#43484d",
+              "fontWeight": "600",
+              "marginBottom": 1,
+              "paddingHorizontal": 15,
+              "paddingVertical": 8,
+            }
+          }
+        >
+          Playback
+        </Text>
+      </View>
+      <View
+        style={
+          Object {
+            "height": 0,
+          }
+        }
+      />
+      <View
+        onLayout={[Function]}
+      >
+        <View
+          style={
+            Object {
+              "margin": 15,
+            }
+          }
+        >
+          <Text
+            onLongPress={[Function]}
+            style={
+              Object {
+                "color": "#43484d",
+                "fontSize": 15,
+              }
+            }
+            testID="app-name"
+          >
+            Jellyfin Mobile (mock)
+          </Text>
+          <Text
+            style={
+              Object {
+                "color": "#43484d",
+                "fontSize": 15,
+              }
+            }
+            testID="app-version"
+          >
+            mock (mock)
+          </Text>
+          <Text
+            style={
+              Object {
+                "color": "#43484d",
+                "fontSize": 15,
+              }
+            }
+            testID="expo-version"
+          >
+            Expo Version: mock
+          </Text>
+        </View>
+      </View>
+    </View>
+  </RCTScrollView>
+</RNCSafeAreaView>
+`;