Fix centerContent on ScrollView

[nandorojo]

Closes #2331.

I tried to naïvely add a unit test, but I don't have experience writing them, so I'm clearly missing something.

I attempted this:

  describe('prop "centerContent"', () => {
    test('without', () => {
      const { container } = render(
        <ScrollView style={{ backgroundColor: 'blue' }} />
      );
      expect(container.firstChild).toMatchSnapshot();
    });

    test('with', () => {
      const { container } = render(
        <ScrollView centerContent style={{ backgroundColor: 'blue' }} />
      );

      expect(container.firstChild).toMatchSnapshot();
      expect(container.firstChild).toHaveStyle('justify-content', 'center');
      expect(container.firstChild).toHaveStyle('flex-grow', '1');
    });
  });

However, it seems that toHaveStyle doesn't exist. I came across that API from searching online for jest-dom + @testing-library/react, but I wasn't really sure where to go from there.

I've tested it in my app and it's working well for me. Happy to add/update a unit test if you have any guidance for updating my broken test.

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 34e2d86:

Sandbox	Source
react-native-web-examples	Configuration

[nandorojo]

Every example of StyleSheet.compose throughout the repo had only two styles passed to it. Since this one now has three, I turned it into an array. If that's incorrect, feel free to let me know.

[burakgormek]

IMO for the test, toMatchSnapshot is enough. It will add classes to div and will compare output to match snapshot. No needed to check with toHaveStyle.

But you have to run test to create initial snapshot.

[nandorojo]

IMO for the test, toMatchSnapshot is enough. It will add classes to div and will compare output to match snapshot. No needed to check with toHaveStyle.

But you have to run test to create initial snapshot.

Thanks for the feedback. Didn’t realize it was that trivial. I pushed the test without toHaveStyle.