Add test for image-example

examples/atomic-block/src/index.js → examples/image-example/src/App.js

@@ -1,6 +1,4 @@
 import React, { Component } from 'react'
-import ReactDOM from 'react-dom'
-
 import { EditorState, convertFromRaw } from 'draft-js'
 import { EditorContainer, Editor } from '@djsp/core'
 import AtomicBlock from '@djsp/atomic-block'
@@ -35,7 +33,7 @@ const rawContent = {
   },
 }
 
-class App extends Component {
+export default class App extends Component {
   state = {
     editorState: EditorState.createWithContent(convertFromRaw(rawContent)),
   }
@@ -66,5 +64,3 @@ class App extends Component {
     )
   }
 }
-
-ReactDOM.render(<App />, document.getElementById('root'))

examples/image-example/src/__tests__/index.js

@@ -0,0 +1,32 @@
+import React from 'react'
+import { render, fireEvent } from 'react-testing-library'
+import { waitForElement } from 'dom-testing-library'
+import App from '../App'
+import { expect } from 'chai'
+
+// afterEach(cleanup)
+
+describe('Tests for render image via @djsp/atomic-block', () => {
+  const { container } = render(<App />)
+  const imageEl = container.querySelector('img')
+
+  it('It should have an image in editor', () => {
+    // eslint-disable-next-line no-unused-expressions
+    expect(imageEl).to.exist
+  })
+
+  it('Image should be focused after clicked', async () => {
+    fireEvent.click(imageEl)
+    const focusedEl = await waitForElement(() =>
+      container.querySelector('.focused')
+    )
+    expect(focusedEl).to.have.class('focused')
+  })
+
+  // Having problem about keyboard event
+  // it('Image should be deleted', async () => {
+  //   fireEvent.keyDown(imageEl, { key: 'backspace', code: 8, charCode: 8})
+  //   await wait(() => console.log(container.querySelector('img')), { interval: 2000 })
+  //   expect(container.querySelector('img')).not.to.exist
+  // })
+})

examples/image-example/src/index.js

@@ -0,0 +1,6 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+
+import App from './App'
+
+ReactDOM.render(<App />, document.getElementById('root'))