From 6b6af651d29055460fbd4430e6b67bd6230a1d45 Mon Sep 17 00:00:00 2001
From: Jason Lundien <50338269+jasonlundien@users.noreply.github.com>
Date: Thu, 24 Feb 2022 09:37:33 -0600
Subject: [PATCH] Add bounce and shake along with tests (#469)

---
 src/components/FontAwesomeIcon.js             |  4 +++
 .../__tests__/FontAwesomeIcon.test.js         | 30 ++++++++++++++++
 .../get-class-list-from-props.test.js         | 36 ++++++++++++++++---
 src/utils/get-class-list-from-props.js        |  6 +++-
 4 files changed, 71 insertions(+), 5 deletions(-)

diff --git a/src/components/FontAwesomeIcon.js b/src/components/FontAwesomeIcon.js
index 5a5754b9..e5e75a1e 100644
--- a/src/components/FontAwesomeIcon.js
+++ b/src/components/FontAwesomeIcon.js
@@ -65,6 +65,8 @@ FontAwesomeIcon.propTypes = {
 
   border: PropTypes.bool,
 
+  bounce: PropTypes.bool,
+
   className: PropTypes.string,
 
   fade: PropTypes.bool,
@@ -97,6 +99,8 @@ FontAwesomeIcon.propTypes = {
 
   rotation: PropTypes.oneOf([0, 90, 180, 270]),
 
+  shake: PropTypes.bool,
+
   size: PropTypes.oneOf([
     '2xs',
     'xs',
diff --git a/src/components/__tests__/FontAwesomeIcon.test.js b/src/components/__tests__/FontAwesomeIcon.test.js
index 87c9b23c..6536f208 100644
--- a/src/components/__tests__/FontAwesomeIcon.test.js
+++ b/src/components/__tests__/FontAwesomeIcon.test.js
@@ -233,6 +233,36 @@ test('using size', () => {
   })
 })
 
+describe('using bounce', () => {
+  test('setting bounce prop to true adds fa-bounce class', () => {
+    const vm = mount({ icon: faCoffee, bounce: true })
+
+    expect(vm.props.className.includes('fa-bounce')).toBeTruthy()
+  })
+
+  test('setting bounce prop to false after setting it to true results in no fa-bounce class', () => {
+    let vm = mount({ icon: faCoffee, bounce: true })
+    expect(vm.props.className.includes('fa-bounce')).toBeTruthy()
+    vm = mount({ icon: faCoffee, bounce: false })
+    expect(vm.props.className.includes('fa-bounce')).toBeFalsy()
+  })
+})
+
+describe('using shake', () => {
+  test('setting shake prop to true adds fa-shake class', () => {
+    const vm = mount({ icon: faCoffee, shake: true })
+
+    expect(vm.props.className.includes('fa-shake')).toBeTruthy()
+  })
+
+  test('setting shake prop to false after setting it to true results in no fa-shake class', () => {
+    let vm = mount({ icon: faCoffee, shake: true })
+    expect(vm.props.className.includes('fa-shake')).toBeTruthy()
+    vm = mount({ icon: faCoffee, shake: false })
+    expect(vm.props.className.includes('fa-shake')).toBeFalsy()
+  })
+})
+
 describe('using spin', () => {
   test('setting spin prop to true adds fa-spin class', () => {
     const vm = mount({ icon: faCoffee, spin: true })
diff --git a/src/utils/__tests__/get-class-list-from-props.test.js b/src/utils/__tests__/get-class-list-from-props.test.js
index c6118cc5..ca922948 100644
--- a/src/utils/__tests__/get-class-list-from-props.test.js
+++ b/src/utils/__tests__/get-class-list-from-props.test.js
@@ -2,8 +2,8 @@ import getClassList from '../get-class-list-from-props'
 
 describe('get class list', () => {
   test('test the booleans', () => {
-    // the six we're testing plus the three defaults
-    const NUM_CLASSES = 6
+    // the eight we're testing plus the three defaults
+    const NUM_CLASSES = 8
 
     const props = {
       spin: true,
@@ -11,21 +11,33 @@ describe('get class list', () => {
       fixedWidth: true,
       inverse: true,
       border: true,
-      listItem: true
+      listItem: true,
+      shake: true,
+      bounce: true
     }
 
     const classList = getClassList(props)
     expect(classList.length).toBe(NUM_CLASSES)
     expect(classList).toStrictEqual([
+      'fa-bounce',
       'fa-spin',
       'fa-pulse',
       'fa-fw',
       'fa-inverse',
       'fa-border',
-      'fa-li'
+      'fa-li',
+      'fa-shake'
     ])
   })
 
+  test('size', () => {
+    function testSize(size) {
+      expect(getClassList({ size })).toStrictEqual([`fa-${size}`])
+    }
+
+    testSize('xs')
+  })
+
   test('flip', () => {
     const HORIZONTAL = 'fa-flip-horizontal'
     const VERTICAL = 'fa-flip-vertical'
@@ -118,3 +130,19 @@ describe('get class list', () => {
     })
   })
 })
+
+test('bounce', () => {
+  function testBounce(bounce) {
+    expect(getClassList({ bounce })).toStrictEqual([`fa-${bounce}`])
+  }
+
+  testBounce('bounce')
+})
+
+test('shake', () => {
+  function testShake(shake) {
+    expect(getClassList({ shake })).toStrictEqual([`fa-${shake}`])
+  }
+
+  testShake('shake')
+})
diff --git a/src/utils/get-class-list-from-props.js b/src/utils/get-class-list-from-props.js
index 251b85f5..7660f37d 100644
--- a/src/utils/get-class-list-from-props.js
+++ b/src/utils/get-class-list-from-props.js
@@ -2,6 +2,7 @@
 export default function classList(props) {
   const {
     beat,
+    bounce,
     fade,
     flash,
     spin,
@@ -15,12 +16,14 @@ export default function classList(props) {
     flip,
     size,
     rotation,
-    pull
+    pull,
+    shake
   } = props
 
   // map of CSS class names to properties
   const classes = {
     'fa-beat': beat,
+    'fa-bounce': bounce,
     'fa-fade': fade,
     'fa-flash': flash,
     'fa-spin': spin,
@@ -37,6 +40,7 @@ export default function classList(props) {
     [`fa-rotate-${rotation}`]:
       typeof rotation !== 'undefined' && rotation !== null && rotation !== 0,
     [`fa-pull-${pull}`]: typeof pull !== 'undefined' && pull !== null,
+    'fa-shake': shake,
     'fa-swap-opacity': props.swapOpacity
   }