import { render, screen } from '@testing-library/react';
import { ThemeProvider } from '../../../theme';
import StickyActionBar from './StickyActionBar';

describe('<StickyActionBar/> component', () => {
  it('renders its children inside a sticky-bottom container', () => {
    const { container } = render(
      <ThemeProvider>
        <StickyActionBar>
          <button type="button">مشاهده ۱۲ پرستار</button>
        </StickyActionBar>
      </ThemeProvider>,
    );
    expect(screen.getByText('مشاهده ۱۲ پرستار')).toBeInTheDocument();
    const bar = container.querySelector('[data-sticky-action-bar]');
    expect(bar).toBeInTheDocument();
    expect(bar).toHaveStyle({ position: 'sticky', bottom: '0px' });
  });
});