Page Previews/QA Plan

From mediawiki.org

Page Previews QA Test[edit]

Previews and Images[edit]

A preview appears, opens, and closes[edit]

  1. Go to this page as a logged out user
  2. Hover over “With image”
    1. Expected behavior:
      1. Preview opens
      2. The title of the article does not appear
      3. The description is truncated with a horizontal gradient
      4. The first instance of bolded text within the article appears bolded within a hovercard. Any other instance of bolded text does not appear bolded
      5. Edit date (or time)
      6. Settings cog
      7. Image (landscape, displayed above text)
  3. Hover away from preview
    1. Expected behavior
      1. Preview closes
  4. Hover over “Lead section image”
      1. Expected behavior:
      2. Preview appears
      3. Preview text is not truncated
      4. The text “lead section image” is bolded within the preview
      5. No other text is bolded within preview
  5. Open “Lead Section image” page preview and click on the preview
    1. Expected behavior
      1. Page navigates to a page named “Lead Section image”
  6. Select “back”
    1. Expected behavior
      1. Page navigates back to the original page.
      2. No page previews are displayed/open OR page preview is open but CLOSES upon moving cursor away from preview
  7. Open “With Image” page preview and click on the link (not the card itself). When page opens, select “back”
    1. Expected behavior
      1. Page navigates back to the original page.
      2. No page previews are displayed/open OR page preview is open but CLOSES upon moving cursor away from preview
  8. Open “With Image” page preview and open the link (not the card itself) in a new tab. When page opens, close new tab
    1. Expected behavior
      1. No page preview is open on original page
  9. Hover over “With tall image”
    1. Expected behavior
      1. Preview must contain all items in 2-a.
      2. Image must display portrait to the right of the text
  10. Hover over “Without image”
    1. Expected behavior
      1. Preview must contain all items in 2-a.
      2. No image should appear
  11. Hover over “Lead Section Image”
    1. Expected behavior
      1. Preview must contain all items in 2-a.
      2. No image should appear
  12. Hover over “Non-free image”
    1. Expected behavior
      1. Preview must contain all items in 2-a.
      2. Ensure an image appears
  13. Click on “Non-free image”
      1. Ensure the first image in the page was the image appearing in the preview above
  14. Hover over “Non-free image”
    1. Expected behavior
      1. Ensure no parenthetical text appears
  15. Click on “Non-free image”
    1. Expected behavior
      1. Ensure there is parenthetical text appearing within the first sentence.
  16. Select “Back”
  17. Hover over “Empty”
    1. Expected behavior - the following appears:
      1. Icon: Sad face icon
      2. Text: Looks like there isn’t a preview for this page
      3. Link: Read
      4. Selecting “Read” navigates users to the article

Special Cases[edit]

Noinclude[edit]

  1. Hover over Noinclude
    1. Expected behavior
      1. Card must not display text: “There was invisible text above this. You should not see this text”
  2. Select card and navigate to article
    1. Expected behavior
      1. Article displays text: “Hello, I am invisible. You do not see me”

Right to left[edit]

Hover over Rtl popups Expected behavior Card displays Arabic text aligned to the right Card displays portrait image Portrait image displays on the right side of the text

Lists[edit]

  1. Hover over “List”
    1. Expected behavior - the following appears:
      1. Icon: Sad face icon
      2. Text: Looks like there isn’t a preview for this page
      3. Link: Read
      4. Selecting “Read” navigates users to the article

Non-existent Pages[edit]

  1. Hover over Redirects to a page that doesn’t exist
    1. Expected behavior:
      1. Icon: Sad face icon
      2. Text: Looks like there isn’t a preview for this page
      3. Link: Read
      4. Ensure selecting “Read” navigates users to a page that was not yet created.

Timing Interactions[edit]

  1. Visit page as logged-out user
  2. Hover over “With image”
    1. Expected behavior
      1. Preview appears
  3. Hover over “With image” preview and hover away
    1. Expected behavior
      1. Preview disappears
  4. Hover over “With image”
    1. Expected behavior
      1. Preview appears
  5. Hover over “With tall image” immediately (before preview has disappeared)
    1. Expected behavior
      1. With tall image preview appears
  6. Hover over “With image”
    1. Expected Behavior
      1. With image preview appears
  7. Hover away
    1. With image preview disappears
  8. Hover over “With tall image”
    1. With tall image preview appears
  9. Hover over “With image” link
    1. With image preview appears
  10. Hover over preview then hover back to link
    1. Preview does not close
  11. Hover away
    1. Preview closes
  12. Hover over “with image”, then immediately hover over “with tall image”, then immediately hover over “without image”
    1. Without image preview appears
  13. Hover over “with image”, preview appears, move cursor to the preview,move cursor away from preview and immediately dwell on preview before it disappears
    1. Preview remains open

Settings[edit]

Workflow - logged out users[edit]

  1. Visit page as logged-out user
  2. Hover over “With Image” link
    1. Expected Behavior
      1. Page Preview Appears
  3. Select settings cog on bottom of page
    1. Expected behavior:
      1. page preview settings modal appears containing:
        1. Button: Save
        2. Radio Button: Enable (selected)
        3. Subtitle: get quick previews of a topic while reading an article
        4. Radio Button: Disable
        5. Button: X
  4. Select X or Save
    1. Expected behavior: enable previews modal closes
  5. Hover over “with image” link and select settings cog on bottom of page
    1. Expected behavior:
      1. page preview settings modal appears containing:
        1. Button: Save
        2. Radio Button: Enable (selected)
        3. Subtitle: get quick previews of a topic while reading an article
        4. Radio Button: Disable
  6. Select “Disable” and “Save”
    1. Expected behavior: enable previews modal appears containing:
      1. Button: Save

Instructions on how to enable previews once disabled[edit]

  1. Hover over “With Image” link
    1. Expected behavior: no preview appears
  2. Scroll to the footer of the page and select “enable previews”
    1. Expected behavior: page preview settings modal appears containing:
      1. Button: X
      2. Button: Save
      3. Radio Button: Enable
      4. Radio Button: Disable (selected)
  3. Select “Save”
    1. Expected behavior: modal closes
  4. Hover over With Image
    1. Expected behavior: page preview does not appear
  5. Scroll to the bottom of the page and select “enable previews”
    1. Expected behavior as above
  6. Select “Enable” and “Save”
    1. Expected behavior:
      1. Page preview modal closes
  7. Hover over With Image
    1. Expected behavior
      1. Page preview appears

Workflow - test closing modals - settings saved[edit]

  1. Visit page as logged-out user
  2. Hover over “With Image” link
  3. Select settings cog on bottom of page
    1. Expected behavior: page preview settings modal appears containing:
      1. Button: X
      2. Button: Save
      3. Radio Button: Enable (selected)
      4. Radio Button: Disable
  4. Select “Disable” and “Save”
    1. Expected behavior: enable previews modal appears containing:
      1. Button: X
      2. Button: Save

Instructions on how to enable previews once disabled[edit]

  1. Select X
    1. Expected behavior: enable previews modal closes
  2. Hover over a link
    1. Expected behavior: no hovercard appears
  3. Scroll to the bottom of the page and select “enable previews”
    1. Expected behavior: page preview settings modal appears containing:
      1. Button: X
      2. Button: Save
      3. Radio Button: Enable (selected)
      4. Radio Button: Disable
      5. Select “Save”
  4. Hover over a link
    1. Expected behavior: page preview appears

Workflow - settings persist anonymous behavior[edit]

  1. Hover over “with image”
    1. Expected behavior:
      1. preview appears
  2. Log in and visit this page
  3. Hover over “with image”
    1. Expected behavior:
      1. preview does not appear
  4. Log out and visit popups corpus
  5. Hover over “with image”
    1. Expected behavior:
      1. preview appears
  6. Select settings cog
  7. turn previews off
  8. Save
  9. Hover over “with image”
    1. Expected behavior:
      1. preview does not appear
  10. Log in and visit popups corpus
  11. Hover over “with image”
    1. Expected behavior:
      1. preview does not appear”
  12. Log out and visit popups corpus
  13. Hover over “with image”
    1. Expected behavior:
      1. preview does not appear
  14. Select “enable previews”
  15. Hover over “with image”
    1. Expected behavior:
      1. preview appears
  16. Log in and log out
  17. Hover over “with image”
    1. Expected behavior:
      1. preview appears

Workflow - logged in users[edit]

  1. Log in and visit this page
  2. Hover over “With image”
    1. Expected behavior: no preview appears
  3. Select “Preferences”
  4. Select “gadgets”
  5. Select “Navigation popups” checkbox
  6. Select save
  7. Select “appearance”
    1. Expected behavior:
      1. Page preview section appears
      2. Page preview section has options “enable” and “disable”
      3. Both options are disabled
      4. Page preview section has message: “you have to disable naviagation popups….”
  8. Select “disable navigation popups…”
  9. Navigate to gadgets tab
  10. Deselect “navigation popups” checkbox
  11. Select save
  12. Select appearance
    1. Expected behavior:
      1. Page preview section appears
      2. Page preview section has options “enable” and “disable”
      3. Both options are selectable
      4. Radio button for “Disable” is selected
      5. Message appears: “Certain gadgets and other customizations may affect the performance of this feature. If you experience problems please review your gadgets and user scripts.”
  13. Select “Enable”
    1. Expected behavior
      1. Radio button for “Enable” is selected
  14. Select “Save”
  15. Go to this page
  16. Hover over “With Image”
    1. Expected behavior
      1. Preview appears
  17. Hover over “with Tall image”
  18. Select settings cog
    1. Expected behavior
      1. System navigates to reading preferences section of preferences page
      2. Page preview section appears
      3. Page preview section has options “enable” and “disable”
      4. Both options are selectable
      5. Radio button for “Enable” is selected
      6. Message appears: “Certain gadgets and other customizations may affect the performance of this feature. If you experience problems please review your gadgets and user scripts.”
  19. Select “Disable”
  20. Select “save”
  21. Go to this page
  22. Hover over “With Image”
    1. Expected behavior
      1. Preview does not appear

Exploratory[edit]

  1. Hover over all the links on the page and note any strange or unexpected behavior
  2. Go through each step of the following workflow - note any unexpected bahavior