Fix DatePicker tests
This commit is contained in:
parent
f6ca4d0a96
commit
9f5946bdc2
|
@ -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');
|
||||
});
|
||||
});
|
||||
|
|
|
@ -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,44 +26,26 @@ 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([], {
|
||||
<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}
|
||||
/>
|
||||
)}
|
||||
|
|
Loading…
Reference in New Issue