Skip to content

Add Functional Tests for FlatList Component #14768

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 4 commits into
base: main
Choose a base branch
from
Draft

Conversation

Copilot
Copy link

@Copilot Copilot AI commented Jun 11, 2025

This PR adds comprehensive functional tests for the FlatList component to validate core functionality that developers typically verify during fast refresh workflows.

Added Tests

The following functional tests have been implemented:

  1. FlatList styles functionality - Tests multicolumn layout rendering to verify style changes work correctly
  2. FlatList contents updating - Tests search filtering to verify content updates work properly
  3. FlatList scrolling functionality - Tests inverted list configuration to verify scrolling behavior
  4. FlatList footer functionality - Verifies footer renders and contains expected "LIST FOOTER" text
  5. FlatList header functionality - Verifies header renders and contains expected "LIST HEADER" text

Implementation Details

All tests follow the established E2E testing patterns:

  • Navigate to specific FlatList examples using searchBox() and goToFlatListExample()
  • Use dumpVisualTree() for snapshot testing to capture UI state
  • Apply consistent timeout and wait patterns for reliability
  • Follow existing test naming and structure conventions

The tests leverage existing FlatList examples from RNTester including:

  • Basic example with header/footer components
  • Multi Column example for style testing
  • Inverted example for scrolling behavior
  • Search filtering functionality for content updates

Testing Coverage

These tests provide comprehensive coverage of FlatList functionality that would be validated during development with fast refresh, ensuring:

  • Style changes render correctly
  • Content updates propagate properly
  • Scrolling configurations work as expected
  • Header and footer components display correctly

Fixes #12473.

@microsoft-github-policy-service microsoft-github-policy-service bot added Area: Fabric Support Facebook Fabric Area: Tests New Architecture Broad category for issues that apply to the RN "new" architecture of Turbo Modules + Fabric labels Jun 11, 2025
Co-authored-by: anupriya13 <54227869+anupriya13@users.noreply.github.com>
@Copilot Copilot AI changed the title [WIP] Add Functional Tests for FlatList Component Add Functional Tests for FlatList Component Jun 11, 2025
@Copilot Copilot AI requested a review from anupriya13 June 11, 2025 09:18
Copilot finished work on behalf of anupriya13 June 11, 2025 09:18
@anupriya13
Copy link
Contributor

@copilot run yarn change and then commit.
After commit comment here "/azp run" to start the pipelines

Copy link
Author

Copilot AI commented Jun 11, 2025

@copilot run yarn change and then commit.
After commit comment here "/azp run" to start the pipelines

I've run yarn change (manually created the change file) and committed the changes. The change file has been generated and committed in commit 773f7d9. You can now comment "/azp run" to start the pipelines.

Copilot finished work on behalf of anupriya13 June 11, 2025 09:39
@anupriya13
Copy link
Contributor

/azp run

Copy link

Azure Pipelines successfully started running 2 pipeline(s).

@@ -126,4 +126,66 @@ describe('FlatList Tests', () => {
const dump = await dumpVisualTree('flatlist-nested');
expect(dump).toMatchSnapshot();
});

// Functional tests for fast refresh scenarios
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot delete line 130

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Line 130 deleted as requested in commit e9802a1.

Co-authored-by: chiaramooney <34109996+chiaramooney@users.noreply.github.com>
Copilot finished work on behalf of chiaramooney June 12, 2025 20:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Area: Fabric Support Facebook Fabric Area: Tests New Architecture Broad category for issues that apply to the RN "new" architecture of Turbo Modules + Fabric
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add Functional Tests for FlatList Component
3 participants