# freeze

## Install

```bash
npm i -D @notiz/freeze
```

## Initialize your freeze config

```bash
npx freeze init
```

A simple `freeze.config.ts` is generated for you.

```ts
import { mobileDevices } from '@notiz/freeze/devices';
import { defineConfig } from '@notiz/freeze/config';

export default defineConfig({
  baseUrl: 'http://localhost:4200',
  output: 'generated/screenshots',
  devices: mobileDevices,
  screens: [{ name: 'landing', url: '' }],
});
```

Read more about the [freeze config file](#freeze-config-file).

## Screenshots

```bash
npx freeze run
```

## Freeze Config File

- `baseUrl` - taking screenshots of your web application e.g your local development server at localhost:4200 or your project website.
- `output` - directory saving your screenshots
- `devices` - a set of devices you want to generate screenshots
- `screens` - a set of screens you want to navigate to before taking a screenshot
  - `name` - name of the screen used as the filename
  - `url` - navigate to the url before taking the screenshot e.g `/portfolio`
  - `pageActions` - perform specific actions per page before taking a screenshot, has access to the puppeteer `Page`
  ```ts
  pageActions: async (page: Page) => {
      await page.click('accept-cookie');
    },
  ```
  - `screenshotTypes`- supports `png`, `jpeg` and `webp` as single value or as array