Testing

PyReact provides utilities for testing your components.

Unit Testing

Test components with pytest:

tests/test_button.py
import pytest
from pyreact import element
from pyreact.testing import render, fireEvent
from my_app.components import Button

def test_button_renders():
    """Test that button renders with correct text"""
    result = render(element(Button, {'text': 'Click me'}))
    assert result.text == 'Click me'

def test_button_click():
    """Test that button handles click events"""
    clicked = []

    def handle_click(event):
        clicked.append(True)

    result = render(element(Button, {
        'text': 'Click me',
        'onClick': handle_click
    }))

    fireEvent.click(result)
    assert len(clicked) == 1

Testing State

Test component state changes:

tests/test_counter.py
from pyreact import element
from pyreact.testing import render, fireEvent
from my_app.components import Counter

def test_counter_initial_state():
    """Test counter initial state"""
    result = render(element(Counter, {}))
    assert result.text == 'Count: 0'

def test_counter_increment():
    """Test counter increment"""
    result = render(element(Counter, {}))

    # Click increment button
    increment_btn = result.find('button', text='+')
    fireEvent.click(increment_btn)

    assert result.text == 'Count: 1'

def test_counter_decrement():
    """Test counter decrement"""
    result = render(element(Counter, {}))

    # Click decrement button
    decrement_btn = result.find('button', text='-')
    fireEvent.click(decrement_btn)

    assert result.text == 'Count: -1'

Testing Props

Test component props:

tests/test_greeting.py
from pyreact import element
from pyreact.testing import render
from my_app.components import Greeting

def test_greeting_with_name():
    """Test greeting with name prop"""
    result = render(element(Greeting, {'name': 'PyReact'}))
    assert 'PyReact' in result.text

def test_greeting_default():
    """Test greeting with default prop"""
    result = render(element(Greeting, {}))
    assert 'World' in result.text

Testing Events

Test event handlers:

tests/test_form.py
from pyreact import element
from pyreact.testing import render, fireEvent
from my_app.components import ContactForm

def test_form_submission():
    """Test form submission"""
    submitted = []

    def handle_submit(event):
        event.preventDefault()
        submitted.append(event.data)

    result = render(element(ContactForm, {
        'onSubmit': handle_submit
    }))

    # Fill form
    name_input = result.find('input', {'name': 'name'})
    fireEvent.change(name_input, {'value': 'John Doe'})

    email_input = result.find('input', {'name': 'email'})
    fireEvent.change(email_input, {'value': 'john@example.com'})

    # Submit form
    form = result.find('form')
    fireEvent.submit(form)

    assert len(submitted) == 1
    assert submitted[0]['name'] == 'John Doe'
    assert submitted[0]['email'] == 'john@example.com'

Testing Async Components

Test async operations:

tests/test_data_fetcher.py
import pytest
from pyreact import element
from pyreact.testing import render, waitFor
from my_app.components import DataFetcher

@pytest.mark.asyncio
async def test_data_fetcher():
    """Test async data fetching"""
    result = render(element(DataFetcher, {}))

    # Initially shows loading
    assert 'Loading' in result.text

    # Wait for data to load
    await waitFor(lambda: 'Data loaded' in result.text)

    # Check final state
    assert 'Data loaded' in result.text

Integration Testing

Test component integration:

tests/test_app_integration.py
from pyreact import element
from pyreact.testing import render, fireEvent
from my_app import App

def test_app_integration():
    """Test full app integration"""
    result = render(element(App, {}))

    # Navigate to about page
    about_link = result.find('a', {'href': '/about'})
    fireEvent.click(about_link)

    # Check about page loaded
    assert 'About Us' in result.text

    # Navigate back home
    home_link = result.find('a', {'href': '/'})
    fireEvent.click(home_link)

    # Check home page loaded
    assert 'Welcome' in result.text

Test Configuration

Configure pytest for PyReact:

tests/conftest.py
import pytest
from pyreact.testing import TestRenderer

@pytest.fixture
def renderer():
    """Provide test renderer"""
    renderer = TestRenderer()
    yield renderer
    renderer.cleanup()

Best Practices

  1. Test behavior, not implementation - Focus on what the component does

  2. Use descriptive test names - test_button_displays_error_when_disabled

  3. Test edge cases - Empty states, errors, loading states

  4. Keep tests isolated - Each test should be independent

  5. Use fixtures - Reuse common test setup

Next Steps