From dfc13e2e54f5950ee300012e451c02dbd5427365 Mon Sep 17 00:00:00 2001
From: Paul Kaplan <pkaplan@media.mit.edu>
Date: Thu, 17 Jan 2019 09:00:24 -0500
Subject: [PATCH 1/3] Fix ordering to allow close button to be clicked.

The previous change that made the images laid out using absolute meant that the close button was layered below the sprite image, making it now clickable
---
 .../sprite-selector-item/sprite-selector-item.jsx  | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/components/sprite-selector-item/sprite-selector-item.jsx b/src/components/sprite-selector-item/sprite-selector-item.jsx
index 3f9ba049479..fd43da31231 100644
--- a/src/components/sprite-selector-item/sprite-selector-item.jsx
+++ b/src/components/sprite-selector-item/sprite-selector-item.jsx
@@ -26,13 +26,6 @@ const SpriteSelectorItem = props => (
         disable={props.dragging}
         id={`${props.name}-${contextMenuId}`}
     >
-        {(props.selected && props.onDeleteButtonClick) ? (
-            <CloseButton
-                className={styles.deleteButton}
-                size={CloseButton.SIZE_SMALL}
-                onClick={props.onDeleteButtonClick}
-            />
-        ) : null }
         {typeof props.number === 'undefined' ? null : (
             <div className={styles.number}>{props.number}</div>
         )}
@@ -53,6 +46,13 @@ const SpriteSelectorItem = props => (
                 <div className={styles.spriteDetails}>{props.details}</div>
             ) : null}
         </div>
+        {(props.selected && props.onDeleteButtonClick) ? (
+            <CloseButton
+                className={styles.deleteButton}
+                size={CloseButton.SIZE_SMALL}
+                onClick={props.onDeleteButtonClick}
+            />
+        ) : null }
         {props.onDuplicateButtonClick || props.onDeleteButtonClick || props.onExportButtonClick ? (
             <ContextMenu id={`${props.name}-${contextMenuId++}`}>
                 {props.onDuplicateButtonClick ? (

From 8485a47f9bef6ccd1d5991f97c6268730b313284 Mon Sep 17 00:00:00 2001
From: Paul Kaplan <pkaplan@media.mit.edu>
Date: Thu, 17 Jan 2019 09:06:30 -0500
Subject: [PATCH 2/3] Add an integration test for using the X button to delete
 a sprite

---
 test/integration/sprites.test.js | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/test/integration/sprites.test.js b/test/integration/sprites.test.js
index 178fb6b984f..a3dd48cf4a5 100644
--- a/test/integration/sprites.test.js
+++ b/test/integration/sprites.test.js
@@ -76,6 +76,17 @@ describe('Working with sprites', () => {
         await expect(logs).toEqual([]);
     });
 
+    test('Deleting by x button on sprite tile', async () => {
+        await loadUri(uri);
+        await clickXpath('//button[@title="Try It"]');
+        await new Promise(resolve => setTimeout(resolve, 1000)); // Wait for scroll animation
+        await clickXpath('//*[@aria-label="Close"]'); // Only visible close button is on the sprite
+        // Confirm that the stage has been switched to
+        await findByText('Stage selected: no motion blocks');
+        const logs = await getLogs();
+        await expect(logs).toEqual([]);
+    });
+
     test('Adding a sprite by uploading a png', async () => {
         await loadUri(uri);
         await clickXpath('//button[@title="Try It"]');

From cc81cc75fc18a082a8279819fd33ad1c70aefa86 Mon Sep 17 00:00:00 2001
From: Paul Kaplan <pkaplan@media.mit.edu>
Date: Thu, 17 Jan 2019 09:15:22 -0500
Subject: [PATCH 3/3] Fix snapshot tests

---
 .../sprite-selector-item.test.jsx.snap        | 48 +++++++++----------
 1 file changed, 24 insertions(+), 24 deletions(-)

diff --git a/test/unit/components/__snapshots__/sprite-selector-item.test.jsx.snap b/test/unit/components/__snapshots__/sprite-selector-item.test.jsx.snap
index e0224d77c19..2aa7a98297e 100644
--- a/test/unit/components/__snapshots__/sprite-selector-item.test.jsx.snap
+++ b/test/unit/components/__snapshots__/sprite-selector-item.test.jsx.snap
@@ -13,18 +13,6 @@ exports[`SpriteSelectorItemComponent matches snapshot when given a number and de
   onTouchEnd={[Function]}
   onTouchStart={[Function]}
 >
-  <div
-    aria-label="Close"
-    className=""
-    onClick={[Function]}
-    role="button"
-    tabIndex="0"
-  >
-    <img
-      className=""
-      src="test-file-stub"
-    />
-  </div>
   <div
     className={undefined}
   >
@@ -57,6 +45,18 @@ exports[`SpriteSelectorItemComponent matches snapshot when given a number and de
       480 x 360
     </div>
   </div>
+  <div
+    aria-label="Close"
+    className=""
+    onClick={[Function]}
+    role="button"
+    tabIndex="0"
+  >
+    <img
+      className=""
+      src="test-file-stub"
+    />
+  </div>
   <nav
     className="react-contextmenu"
     onContextMenu={[Function]}
@@ -103,18 +103,6 @@ exports[`SpriteSelectorItemComponent matches snapshot when selected 1`] = `
   onTouchEnd={[Function]}
   onTouchStart={[Function]}
 >
-  <div
-    aria-label="Close"
-    className=""
-    onClick={[Function]}
-    role="button"
-    tabIndex="0"
-  >
-    <img
-      className=""
-      src="test-file-stub"
-    />
-  </div>
   <div
     className={undefined}
   >
@@ -137,6 +125,18 @@ exports[`SpriteSelectorItemComponent matches snapshot when selected 1`] = `
       Pony sprite
     </div>
   </div>
+  <div
+    aria-label="Close"
+    className=""
+    onClick={[Function]}
+    role="button"
+    tabIndex="0"
+  >
+    <img
+      className=""
+      src="test-file-stub"
+    />
+  </div>
   <nav
     className="react-contextmenu"
     onContextMenu={[Function]}