Fix DatePicker tests

facebook · Mar 12, 2019 · 9f5946b · 9f5946b
1 parent f6ca4d0
commit 9f5946b
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 41 deletions.
diff --git a/RNTester/e2e/__tests__/DatePickerIOS-test.js b/RNTester/e2e/__tests__/DatePickerIOS-test.js
@@ -27,33 +27,34 @@ describe('DatePickerIOS', () => {
   it('Should change indicator with datetime picker', async () => {
     await openExampleWithTitle('Date and time picker');
     const testID = 'date-and-time';
-    const indicatorID = 'date-and-time-indicator';
 
     const testElement = await element(
       by.type('UIPickerView').withAncestor(by.id(testID)),
     );
-    const indicator = await element(by.id(indicatorID));
+    const dateIndicator = await element(by.id('date-indicator'));
+    const timeIndicator = await element(by.id('time-indicator'));
 
     await expect(testElement).toBeVisible();
-    await expect(indicator).toBeVisible();
+    await expect(dateIndicator).toBeVisible();
+    await expect(timeIndicator).toBeVisible();
 
     await testElement.setColumnToValue(0, 'Dec 4');
     await testElement.setColumnToValue(1, '4');
     await testElement.setColumnToValue(2, '10');
     await testElement.setColumnToValue(3, 'AM');
 
-    await expect(indicator).toHaveText('12/4/2005 4:10 AM');
+    await expect(dateIndicator).toHaveText('12/4/2005');
+    await expect(timeIndicator).toHaveText('4:10 AM');
   });
 
   it('Should change indicator with date-only picker', async () => {
-    await openExampleWithTitle('Date only');
+    await openExampleWithTitle('Date only picker');
     const testID = 'date-only';
-    const indicatorID = 'date-and-time-indicator';
 
     const testElement = await element(
       by.type('UIPickerView').withAncestor(by.id(testID)),
     );
-    const indicator = await element(by.id(indicatorID));
+    const indicator = await element(by.id('date-indicator'));
 
     await expect(testElement).toBeVisible();
     await expect(indicator).toBeVisible();
@@ -62,6 +63,6 @@ describe('DatePickerIOS', () => {
     await testElement.setColumnToValue(1, '3');
     await testElement.setColumnToValue(2, '2006');
 
-    await expect(indicator).toHaveText('11/3/2006 4:10 AM');
+    await expect(indicator).toHaveText('11/3/2006');
   });
 });
diff --git a/RNTester/js/DatePickerIOSExample.js b/RNTester/js/DatePickerIOSExample.js
@@ -12,7 +12,7 @@
 
 const React = require('react');
 const ReactNative = require('react-native');
-const {DatePickerIOS, StyleSheet, Text, TextInput, View} = ReactNative;
+const {DatePickerIOS, StyleSheet, Text, View} = ReactNative;
 
 type State = {|
   date: Date,
@@ -26,43 +26,25 @@ type Props = {|
 class WithDatePickerData extends React.Component<Props, State> {
   state = {
     date: new Date(),
-    timeZoneOffsetInHours: (-1 * new Date().getTimezoneOffset()) / 60,
   };
 
   onDateChange = date => {
     this.setState({date: date});
   };
 
-  onTimezoneChange = event => {
-    const offset = parseInt(event.nativeEvent.text, 10);
-    if (isNaN(offset)) {
-      return;
-    }
-    this.setState({timeZoneOffsetInHours: offset});
-  };
-
   render() {
-    // Ideally, the timezone input would be a picker rather than a
-    // text input, but we don't have any pickers yet :(
     return (
       <View>
         <WithLabel label="Value:">
-          <Text testID="date-and-time-indicator">
-            {this.state.date.toLocaleDateString() +
-              ' ' +
-              this.state.date.toLocaleTimeString([], {
-                hour: '2-digit',
-                minute: '2-digit',
-              })}
+          <Text testID="date-indicator">
+            {this.state.date.toLocaleDateString()}
+          </Text>
+          <Text testID="time-indicator">
+            {this.state.date.toLocaleTimeString([], {
+              hour: '2-digit',
+              minute: '2-digit',
+            })}
           </Text>
-        </WithLabel>
-        <WithLabel label="Timezone:">
-          <TextInput
-            onChange={this.onTimezoneChange}
-            style={styles.textinput}
-            value={this.state.timeZoneOffsetInHours.toString()}
-          />
-          <Text> hours from UTC</Text>
         </WithLabel>
         {this.props.children(this.state, this.onDateChange)}
       </View>
@@ -124,7 +106,6 @@ exports.examples = [
               testID="date-and-time"
               date={state.date}
               mode="datetime"
-              timeZoneOffsetInMinutes={state.timeZoneOffsetInHours * 60}
               onDateChange={onDateChange}
             />
           )}
@@ -142,7 +123,6 @@ exports.examples = [
               testID="date-only"
               date={state.date}
               mode="date"
-              timeZoneOffsetInMinutes={state.timeZoneOffsetInHours * 60}
               onDateChange={onDateChange}
             />
           )}
@@ -151,16 +131,16 @@ exports.examples = [
     },
   },
   {
-    title: 'Time only picker, 10-minute interval',
+    title: 'Picker with 20-minute interval',
     render: function(): React.Element<any> {
       return (
         <WithDatePickerData>
           {(state, onDateChange) => (
             <DatePickerIOS
-              testID="time-only"
+              testID="date-and-time-with-interval"
               date={state.date}
-              mode="time"
-              timeZoneOffsetInMinutes={state.timeZoneOffsetInHours * 60}
+              minuteInterval={20}
+              mode="datetime"
               onDateChange={onDateChange}
             />
           )}