From 400283ae50984571133f0c96693d64884259f646 Mon Sep 17 00:00:00 2001
From: Erik <ErikOstlund@users.noreply.github.com>
Date: Mon, 9 May 2022 04:02:23 -0500
Subject: [PATCH] Convert enzyme test to RTL (#3051)

---
 .../DeleteButton/DeleteButton.spec.js         | 61 ++-----------------
 1 file changed, 5 insertions(+), 56 deletions(-)

diff --git a/packages/lib-classifier/src/plugins/drawingTools/components/DeleteButton/DeleteButton.spec.js b/packages/lib-classifier/src/plugins/drawingTools/components/DeleteButton/DeleteButton.spec.js
index c6d13503a1..92346e2bc9 100644
--- a/packages/lib-classifier/src/plugins/drawingTools/components/DeleteButton/DeleteButton.spec.js
+++ b/packages/lib-classifier/src/plugins/drawingTools/components/DeleteButton/DeleteButton.spec.js
@@ -1,7 +1,6 @@
 import React from 'react'
-import { shallow } from 'enzyme'
+import { render, screen } from '@testing-library/react'
 import { expect } from 'chai'
-import sinon from 'sinon'
 import { Point } from '@plugins/drawingTools/models/marks'
 import { DeleteButton } from './DeleteButton'
 
@@ -9,62 +8,12 @@ describe('Drawing tools > DeleteButton', function () {
   const mark = Point.create({ id: 'point1', x: 50, y: 50, toolType: 'point' })
 
   it('should render without crashing', function () {
-    const wrapper = shallow(<DeleteButton label='Delete' mark={mark} />)
-    expect(wrapper).to.be.ok()
-  })
-
-  it('should be positioned by its mark', function () {
-    const { x, y } = mark.deleteButtonPosition(1)
-    const wrapper = shallow(<DeleteButton label='Delete' mark={mark} />)
-    const transform = wrapper.root().prop('transform')
-    expect(transform).to.have.string(`translate(${x}, ${y})`)
-  })
-
-  describe('on pointer down', function () {
-    it('should call onDelete', function () {
-      const fakeEvent = new Event('pointerdown')
-      const onDelete = sinon.stub()
-      const wrapper = shallow(<DeleteButton label='Delete' mark={mark} onDelete={onDelete} />)
-      wrapper.simulate('pointerdown', fakeEvent)
-      expect(onDelete).to.have.been.calledOnce()
-    })
-  })
+    render(<DeleteButton label='Delete' mark={mark} />)
 
-  describe('on blur', function () {
-    it('should be deselected', function () {
-      const onDeselect = sinon.spy()
-      const wrapper = shallow(<DeleteButton label='Delete' mark={mark} onDeselect={onDeselect} />)
-      wrapper.simulate('blur')
-      expect(onDeselect).to.have.been.calledOnce()
-    })
-  })
-
-  describe('on key down', function () {
-    it('should call onDelete for Enter', function () {
-      const fakeEvent = new Event('keydown')
-      fakeEvent.key = 'Enter'
-      const onDelete = sinon.stub()
-      const wrapper = shallow(<DeleteButton label='Delete' mark={mark} onDelete={onDelete} />)
-      wrapper.simulate('keydown', fakeEvent)
-      expect(onDelete).to.have.been.calledOnce()
+    const deleteButton = screen.getByRole('button', {
+      name: /delete/i
     })
 
-    it('should call onDelete for space', function () {
-      const fakeEvent = new Event('keydown')
-      fakeEvent.key = ' '
-      const onDelete = sinon.stub()
-      const wrapper = shallow(<DeleteButton label='Delete' mark={mark} onDelete={onDelete} />)
-      wrapper.simulate('keydown', fakeEvent)
-      expect(onDelete).to.have.been.calledOnce()
-    })
-
-    it('should ignore any other key', function () {
-      const fakeEvent = new Event('keydown')
-      fakeEvent.key = 'Tab'
-      const onDelete = sinon.stub()
-      const wrapper = shallow(<DeleteButton label='Delete' mark={mark} onDelete={onDelete} />)
-      wrapper.simulate('keydown', fakeEvent)
-      expect(onDelete).to.have.not.been.called()
-    })
+    expect(deleteButton).to.exist()
   })
 })