# Sled Tests

**Category:** Guides/Sled Tests

## Design

### Overview

The power of uni drivers provided by `Wix Patterns` is that we can use them also in `puppeteer` environment.

After initializing a `sled` page, simply create a testkit instance (See full example under `Recipes` below):

```typescript jsx
import { TableTestkit } from '@wix/patterns/testkit/puppeteer';
import { Page } from 'puppeteer';

class TestDriver {
  _page: Page; // A `puppeteer` page

  async getTable() {
    return TableTestkit({
      page: this._page,
      wrapper: await this._page.waitForSelector('[data-hook="products-page"]'),
      dataHook: 'products-infinite-scroll-table',
    });
  }
}
```


---

### Recipes

### SledTestDriver.ts

```tsx
import '@wix/sled-test-runner';
import { injectBMOverrides } from '@wix/yoshi-flow-bm/sled';
import { TableTestkit } from '@wix/patterns/testkit/puppeteer';

type UnpackPromise<T> = T extends Promise<infer U> ? U : T;

export class SledTestDriver {
  _page?: UnpackPromise<ReturnType<typeof sled['newPage']>>['page'];

  get page() {
    if (this._page == null) {
      throw new Error('Sled was not initialized, call gotoPage first');
    }
    return this._page;
  }

  async getTable() {
    return TableTestkit({
      page: this.page,
      wrapper: await this.page.waitForSelector('[data-hook="products-page"]'),
      dataHook: 'products-infinite-scroll-table',
    });
  }

  private async setupPage() {
    const { page } = this;

    await page.setViewport({ width: 1200, height: 699 });

    await sled.loginAsUser(page, 'wixqatest.yoshi@gmail.com');

    await injectBMOverrides({
      page,
      appConfig: require('../../target/module-sled.merged.json'),
    });

    await page.goto(
      `https://www.wix.com/dashboard/c1573770-4133-4014-b539-c0c0ff8dd5db/cairo-example-bm/infinite-scroll-table`,
    );
  }

  async gotoPage() {
    this._page = (await sled.newPage()).page;
    await this.setupPage();
  }
}
```

---

### index.spec.ts

```tsx
import { SledTestDriver } from './SledTestDriver';

describe('ProductsTable', () => {
  const driver = new SledTestDriver();

  it('happy flow', async () => {
    await driver.gotoPage();
    const testkit = await driver.getTable();

    await testkit.waitInitialLoaderRemoved();
    expect(await testkit.getRowsCount()).toBe(100);

    await testkit.scrollDown();
    await testkit.getRow(101).wait(10000);
    expect(await testkit.getRowsCount()).toBe(200);
  });
});
```

