> For the complete documentation index, see [llms.txt](https://imcuttle.gitbook.io/slate/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://imcuttle.gitbook.io/slate/other-packages/index-4.md).

# slate-simulator

```javascript
import Simulator from 'slate-simulator'
```

A simulator to help writing tests for Slate editors and plugins. By default the simulator does not include the [core plugins](https://docs.slatejs.org/guides/plugins#core-plugins) as they have a lot of dependencies on browser-specific globals, so running them in CI environments is very hard. If you need the core plugins for your use case you need to import them manually.

## Example

```javascript
import Simulator from 'slate-simulator'

const value = ...
const plugins = [ ... ]
const simulator = new Simulator({ value, plugins })

simulator
  .focus()
  .beforeInput({ data: 'H' })
  .beforeInput({ data: 'e' })
  .beforeInput({ data: 'l' })
  .beforeInput({ data: 'l' })
  .beforeInput({ data: 'o' })
  .beforeInput({ data: '!' })
  .keyDown({ key: 'Enter' })

const newValue = simulator.value
```

## Example with core plugins

```javascript
import Simulator from 'slate-simulator'
import { BeforePlugin, AfterPlugin } from 'slate-react'

const value = ...
const plugins = [ BeforePlugin(), ... , AfterPlugin() ]
const simulator = new Simulator({ value, plugins })
```

Core plugins will trigger default behaviour for the events. Without them, only the changes defined in the plugins passed to slate-simulator will be applied. For example, `beforeInput()` event will not insert the data's text if none of the plugins being tested does it.

## Example for `DataTransfer` events

In order to simulate paste and drop events you will need to create a [DataTransfer](https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer). However this object is browser dependant and is not easy to manipulate in CI environments. The easiest work around is to fake its API with a mockup class:

```javascript
class FakeDataTransfer {
  constructor(props) {
    this.items = []
    this.types = []
  }

  getData(key) {
    return this.items.find(item => item.key === key).value
  }

  setData(key, value) {
    this.types.push(key)
    this.items.push({ key, value })
  }
}
```

Later, you can use it this way to fake a paste event:

```javascript
import { setEventTransfer } from 'slate-react'

const pastedText = 'slatejs.org'

const fakeDataTransfer = new FakeDataTransfer()
fakeDataTransfer.setData('text', "this text doesn't matter")

const pasteEvent = { dataTransfer: fakeDataTransfer }
setEventTransfer(pasteEvent, 'text', pastedText)

simulator.paste(pasteEvent)
```

## Methods

### `beforeInput`

`beforeInput(event: Object) => Simulator`

Simulator a `beforeinput` event with an `event` object.

### `blur`

`blur(event: Object) => Simulator`

Simulator a `blur` event with an `event` object.

### `copy`

`copy(event: Object) => Simulator`

Simulator a `copy` event with an `event` object.

### `cut`

`cut(event: Object) => Simulator`

Simulator a `cut` event with an `event` object.

### `drop`

`drop(event: Object) => Simulator`

Simulator a `drop` event with an `event` object.

### `focus`

`focus(event: Object) => Simulator`

Simulator a `focus` event with an `event` object.

### `keyDown`

`keyDown(event: Object) => Simulator`

Simulator a `keyDown` event with an `event` object.

### `keyUp`

`keyUp(event: Object) => Simulator`

Simulator a `keyUp` event with an `event` object.

### `paste`

`paste(event: Object) => Simulator`

Simulator a `paste` event with an `event` object.

### `select`

`select(event: Object) => Simulator`

Simulator a `select` event with an `event` object.