Skip to content

Instantly share code, notes, and snippets.

@tamlyn tamlyn/Readme.md
Created Nov 21, 2017

Embed
What would you like to do?
Slate Editor + Testcafe + WebKit

Test case

Bug when running Testcafe on Slate Editor inputs in Chrome/Safari

  1. Serve index.html on port 8080, e.g. http-server
  2. Run test, e.g. testcafe chrome test.js

Expected

New text is appended to input

Actual

Chrome / Safari

New text is weirdly interspersed into existing text

screenshot

Firefox

Behaves as expected

<html>
<head><title>Edit test</title></head>
<body>
<div id="root"></div>
<script src="https://unpkg.com/react@15/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom-server.js"></script>
<script src="https://unpkg.com/immutable/dist/immutable.js"></script>
<script src="https://unpkg.com/slate/dist/slate.js"></script>
<script src="https://unpkg.com/slate-react/dist/slate-react.js"></script>
<script>
const initialValue = Slate.Value.fromJSON({
document: {
nodes: [
{
kind: 'block',
type: 'paragraph',
nodes: [
{
kind: 'text',
leaves: [
{
text: 'A line of text in a paragraph.'
}
]
}
]
}
]
}
})
class App extends React.Component {
constructor() {
super()
this.state = {
value: initialValue
}
}
onChange({value}) {
this.setState({value})
}
render() {
return React.createElement(SlateReact.Editor, {value: this.state.value, onChange: this.onChange.bind(this)})
}
}
ReactDOM.render(React.createElement(App), document.getElementById('root'))
</script>
</body>
</html>
fixture('Slate editor')
test('Typing', t => t
.navigateTo('http://localhost:8080')
.typeText('div[contenteditable=true]', 'This is some text which does not work', {speed: 0.1})
)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.