Skip to main content

dynamic-content Scenario 2 — Wait for React Network Idle and Extract List

Written by RTILA X Engineering Team

Beginner ~4 min

What You'll Learn

Wait for an element to appear or disappear

Real-World Use Case

Dealing with disappearing spinners

LIVE DEMO

Rendering...
EXPECTED OUTPUT

RTILA X PROJECT JSON 

    {
  "name": "Wait_For_React_Network_Idle",
  "settings": {
    "urls": [
      "https://learn.rtila.com/scenarios/dynamic-content/2"
    ]
  },
  "datasets": {
    "react_items": {
      "item_selector": "css=.react-item",
      "properties": [
        {
          "name": "title",
          "type": "text",
          "selector": "css=.react-item-title"
        },
        {
          "name": "desc",
          "type": "text",
          "selector": "css=.react-item-desc"
        }
      ]
    }
  },
  "commands": [
    {
      "command": "wait_for_load_state",
      "params": {
        "state": "networkidle",
        "timeout": 30000
      }
    },
    {
      "command": "wait_for_selector",
      "params": {
        "selector": "css=.react-item"
      }
    },
    {
      "command": "extract_data",
      "params": {
        "dataset": "react_items"
      }
    }
  ]
}

wait_for_load_state with networkidle waits for network requests to settle before continuing. This is useful for React apps that fetch data after mounting.

Did you complete this scenario?

Ready to run this automation?

Copy the project JSON above, open RTILA X, create a new project, and paste it.

Download RTILA X Free → View setup guide →

This scenario covers 1 RTILA X command and is referenced in 1 learning article.

Continue Learning

Was this helpful?