refine invariant error message at scrollToIndex (#28464)

Summary:
I refined the error message of scrollToIndex.

When I used scrollToIndex with `index:0` and data that length is 0, I met the odd error message `Invariant Violation scrollToIndex out of range: requested index 0 but maximum is -1`.

Next, I thought that scrollToIndex with `index:-1` meant scrollToTop without checking data length. I met `Invariant Violation: scrollToIndex out of range: requested index -1 but maximum is -1`

Finally, I wondered what will happen to use scrollToIndex with `index:-1` and data that length is `5`. The result is `Invariant Violation: scrollToIndex out of range: requested index -1 but maximum is 5`

The above error messages will confuse us. I clarified the boudaries and separated the error messages

## Changelog

[General] [Fixed] - Clarified the boundaries in error message of scrollToIndex
Pull Request resolved: https://github.com/facebook/react-native/pull/28464

Test Plan:
I added 3 test cases to cover the new error messages for VirtualizedList.
Run `yarn test` and confirm it passes.

Reviewed By: cpojer

Differential Revision: D21140133

Pulled By: TheSavior

fbshipit-source-id: 9a7a704f7ec599d833d2ed3ca2be059d950539b5

Libraries/Lists/VirtualizedList.js

@@ -418,8 +418,18 @@ class VirtualizedList extends React.PureComponent<Props, State> {
     } = this.props;
     const {animated, index, viewOffset, viewPosition} = params;
     invariant(
-      index >= 0 && index < getItemCount(data),
-      `scrollToIndex out of range: requested index ${index} but maximum is ${getItemCount(
+      index >= 0,
+      `scrollToIndex out of range: requested index ${index} but minimum is 0`,
+    );
+    invariant(
+      getItemCount(data) >= 1,
+      `scrollToIndex out of range: item length ${getItemCount(
+        data,
+      )} but minimum is 1`,
+    );
+    invariant(
+      index < getItemCount(data),
+      `scrollToIndex out of range: requested index ${index} is out of 0 to ${getItemCount(
         data,
       ) - 1}`,
     );

Libraries/Lists/__tests__/VirtualizedList-test.js

@@ -456,4 +456,52 @@ describe('VirtualizedList', () => {
       console.error.mockRestore();
     }
   });
+
+  it('throws if using scrollToIndex with index less than 0', () => {
+    const component = ReactTestRenderer.create(
+      <VirtualizedList
+        data={[{key: 'i1'}, {key: 'i2'}, {key: 'i3'}]}
+        renderItem={({item}) => <item value={item.key} />}
+        getItem={(data, index) => data[index]}
+        getItemCount={data => data.length}
+      />,
+    );
+    const instance = component.getInstance();
+
+    expect(() => instance.scrollToIndex({index: -1})).toThrow(
+      'scrollToIndex out of range: requested index -1 but minimum is 0',
+    );
+  });
+
+  it('throws if using scrollToIndex when item length is less than 1', () => {
+    const component = ReactTestRenderer.create(
+      <VirtualizedList
+        data={[]}
+        renderItem={({item}) => <item value={item.key} />}
+        getItem={(data, index) => data[index]}
+        getItemCount={data => data.length}
+      />,
+    );
+    const instance = component.getInstance();
+
+    expect(() => instance.scrollToIndex({index: 1})).toThrow(
+      'scrollToIndex out of range: item length 0 but minimum is 1',
+    );
+  });
+
+  it('throws if using scrollToIndex when requested index is bigger than or equal to item length', () => {
+    const component = ReactTestRenderer.create(
+      <VirtualizedList
+        data={[{key: 'i1'}, {key: 'i2'}, {key: 'i3'}]}
+        renderItem={({item}) => <item value={item.key} />}
+        getItem={(data, index) => data[index]}
+        getItemCount={data => data.length}
+      />,
+    );
+    const instance = component.getInstance();
+
+    expect(() => instance.scrollToIndex({index: 3})).toThrow(
+      'scrollToIndex out of range: requested index 3 is out of 0 to 2',
+    );
+  });
 });