Reorderer QA Test Plan - Image Reorderer

QA Tests

Protocol
Perform the following tests using each browser/system environment

Please search for issues before reporting them, so as to limit the number of duplicate entries.

Protocol
Launch the following website to execute unit tests.

Description
Ensures that the component properly traverses through the various states.

Protocol
Perform these tasks on the following site, perform the tests 1-4 and 5-7 in order.

Site
Demo

Test 1: Mouseover

Procedure
1. Open the browser and navigate to the specified URL
2. Using the mouse, hover over one of the images

Expected Results
- The pointer should be a move cursor (cross or hand)
- The styling of the border around the image should change

Test 2: Mouse, Pickup Avatar

Procedure
1. Complete Test 1
2. Using the mouse, press and hold the 'left-mouse-button' down
3. Using the mouse, drag slightly to the right

Expected Results
- An avatar (representing the image) should be created
- The avatar should remain under the pointer as you drag around

Test 3: Mouse, Move Avatar

Procedure
1. Complete Test 2
2. Using the mouse, drag the avatar around the screen
Expected Results
- Notice that drop targets appear as you move over valid drop points

Test 4: Mouse, Drop Avatar

Procedure
1. Complete Test 3
2. Using the mouse, release the 'left-mouse-button' over a drop target
Expected Results
- The avatar should drop and move the image to the new location
- The other images should shift to fill in the empty space where the image was originally located

Test 5: Keyboard, Focus

Procedure
1. Open the browser and navigate to the specified URL
2. Using the keyboard, tap the 'tab' key until one of the images has focus

Expected Results
- The styling of the element should change to indicate that the image has focus

Test 6: Keyboard, Navigate Images

Procedure
1. Complete Test 5
2. Using the keyboard, tap the 'i', 'j', 'k', 'm', or an 'arrow'