PracticeQAAutomation logoPracticeQAAutomation
Se

Java · TestNG

Social media with Selenium

Compose posts with a live character counter, @mention autocomplete and an image, like and comment instantly, scroll an infinite feed, follow people and read notifications.

App under test

🐦 Chirp

URL
/apps/social
Signed in as
@amir
Post limit
280 characters
Feed page
5 posts per load

Scenarios to automate

Work top to bottom — each one adds a new technique.

  1. 1

    Character counter

    Beginner

    post-count counts down from 280, turns amber under 20 and red below 0; publish-post disables over the limit.

  2. 2

    @mention autocomplete

    Intermediate

    Type “@m” to open mention-suggestions and pick mention-option-mia; the text becomes “@mia ”.

  3. 3

    Scoped locators

    Intermediate

    Every post uses the same like-button / comment-input IDs — scope to a post-card (first, nth, or by data-post-id).

  4. 4

    Instant likes

    Beginner

    like-button toggles aria-pressed and like-count immediately — assert both before and after.

  5. 5

    Infinite scroll

    Advanced

    Scroll to feed-sentinel to load 5 more (loaded-posts grows); stop when feed-end appears.

  6. 6

    Notifications

    Beginner

    notification-count shows unread; mark-all-read clears the badge.

  7. 7

    Follow a user

    Intermediate

    follow-<handle> toggles “Following ✓” and follower-count changes by one.

  8. 8

    Image attach

    Intermediate

    Upload via the hidden post-image-input (setInputFiles/selectFile/sendKeys); image-preview shows the name.

Sample Selenium suite

A working starting point that finds elements every way Selenium can — by role, label, text, id, name, CSS, XPath and data-testid — so you practice them all. Pick your language, switch to data-testid only to compare, or try your own in the Locator Playground.

Language
ChirpSocialTest.java
import org.testng.annotations.*;
import org.openqa.selenium.*;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.chrome.ChromeOptions;
import java.util.Map;
import org.openqa.selenium.support.ui.*;
import java.time.Duration;
import static org.openqa.selenium.support.ui.ExpectedConditions.*;

// Locators in this suite: By.xpath ×2 · data-testid ×4
public class ChirpSocialTest {
  static final String BASE = "https://www.practiceqaautomation.com";
  WebDriver driver;
  WebDriverWait wait;

  // Small helpers: every action takes a By and waits for its element first (no Thread.sleep).
  By tid(String id) { return By.cssSelector("[data-testid='" + id + "']"); }
  WebElement ready(By by) { return centre(wait.until(elementToBeClickable(by))); }
  void click(By by) { ready(by).click(); }
  WebElement nth(String id, int n) { return centre(wait.until(numberOfElementsToBeMoreThan(tid(id), n)).get(n)); }
  void clickNth(String id, int n) { nth(id, n).click(); }
  // Scroll to the middle of the screen first: Selenium only scrolls an element to the edge,
  // where a sticky header or a fixed bottom bar can cover it (ElementClickInterceptedException).
  WebElement centre(WebElement e) {
    ((JavascriptExecutor) driver).executeScript("arguments[0].scrollIntoView({block: 'center', inline: 'nearest'})", e);
    return e;
  }
  void type(By by, String text) { ready(by).sendKeys(text); }
  void select(By by, String value) { new Select(ready(by)).selectByValue(value); }
  void check(By by) { WebElement e = ready(by); if (!e.isSelected()) e.click(); }
  void expectText(By by, String text) { wait.until(textToBePresentInElementLocated(by, text)); }
  void expectVisible(By by) { wait.until(visibilityOfElementLocated(by)); }
  void expectNthText(String id, int n, String text) {
    wait.until(d -> d.findElements(tid(id)).size() > n && d.findElements(tid(id)).get(n).getText().contains(text));
  }

  @BeforeMethod
  public void setUp() {
    ChromeOptions options = new ChromeOptions();
    // Turn off Chrome's "Save password?" and "password found in a data breach" pop-ups: after a
    // login they take the keyboard and mouse away from the page, so later typing and clicks are lost.
    options.setExperimentalOption("prefs", Map.of(
        "credentials_enable_service", false,
        "profile.password_manager_enabled", false,
        "profile.password_manager_leak_detection", false));
    driver = new ChromeDriver(options);
    wait = new WebDriverWait(driver, Duration.ofSeconds(10));
  }

  @AfterMethod(alwaysRun = true)
  public void tearDown() { driver.quit(); }

  @Test
  public void postsWithAMentionLikesCommentsAndFollows() {
    driver.get(BASE + "/apps/social");
    type(tid("post-input"), "Great pairing session today with @mi");
    click(tid("mention-option-mia"));
    click(By.xpath("//button[normalize-space()='Post']"));
    expectNthText("post-text", 0, "with @mia");

    // Interact with the newest post (first card)
    clickNth("like-button", 0);
    expectNthText("like-count", 0, "1");
    clickNth("comments-toggle", 0);
    nth("comment-input", 0).sendKeys("Thanks for the help!");
    clickNth("add-comment", 0);
    expectNthText("comment-count", 0, "1");
    clickNth("mention-link", 0);
    expectText(tid("profile-name"), "Mia Chen");
    click(By.xpath("//button[normalize-space()='Follow']"));
    expectText(tid("follower-count"), "2311");
  }
}

Practicing another tool?