# Monitoring the dynamic elements in synthetic

**URL:** <https://discuss.elastic.co/t/monitoring-the-dynamic-elements-in-synthetic/363207>\
**Category:** Synthetics\
**Created:** [July 16, 2024, 9:54am UTC](https://discuss.elastic.co/t/monitoring-the-dynamic-elements-in-synthetic/363207 "2024-07-16T09:54:35Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sachin\_Chourasiya](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/sachin_chourasiya/32/122573_2.png) [@Sachin\_Chourasiya](https://discuss.elastic.co/u/Sachin_Chourasiya)\
**Post date:** [July 16, 2024, 9:54am UTC](https://discuss.elastic.co/t/monitoring-the-dynamic-elements-in-synthetic/363207/1 "2024-07-16T09:54:35Z")

</div>

Can we monitor the DOM element of the page and put the alert on the dynamic status of the different jobs

---

<div class="post-metadata">

**Author:** ![carly.richmond](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/carly.richmond/32/104935_2.png) [@carly.richmond](https://discuss.elastic.co/u/carly.richmond)\
**Post date:** [July 16, 2024, 9:57am UTC](https://discuss.elastic.co/t/monitoring-the-dynamic-elements-in-synthetic/363207/2 "2024-07-16T09:57:52Z")

</div>

Hi @Sachin_Chourasiya,

It would be useful to have more information on what you're trying to pick up from the page. Do you mean you want to check a particular state or attribute of a DOM element on the page and then trigger an alert based on the value? Are you using [browser-based monitors](https://www.elastic.co/guide/en/observability/current/synthetics-create-test.html) using Playwright at all?

---

<div class="post-metadata">

**Author:** ![Sachin\_Chourasiya](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/sachin_chourasiya/32/122573_2.png) [@Sachin\_Chourasiya](https://discuss.elastic.co/u/Sachin_Chourasiya)\
**Post date:** [July 16, 2024, 10:01am UTC](https://discuss.elastic.co/t/monitoring-the-dynamic-elements-in-synthetic/363207/3 "2024-07-16T10:01:40Z")

</div>

Thanks for response,  
I have attached the image of the page that we want to monitor  
we want to trigger the alert if any job's state is "failed"

 ![MicrosoftTeams-image](https://us1.discourse-cdn.com/elastic/original/3X/e/e/eeaebf87c1dc0037996fb7c175ef62516dc04138.png)

---

<div class="post-metadata">

**Author:** ![Anjali3](https://avatars.discourse-cdn.com/v4/letter/a/48db29/32.png) [@Anjali3](https://discuss.elastic.co/u/Anjali3)\
**Post date:** [July 16, 2024, 10:21am UTC](https://discuss.elastic.co/t/monitoring-the-dynamic-elements-in-synthetic/363207/4 "2024-07-16T10:21:25Z")

</div>

Hi Carly,

We want to set alert around the dynamic status of jobs

---

<div class="post-metadata">

**Author:** ![carly.richmond](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/carly.richmond/32/104935_2.png) [@carly.richmond](https://discuss.elastic.co/u/carly.richmond)\
**Post date:** [July 16, 2024, 11:07am UTC](https://discuss.elastic.co/t/monitoring-the-dynamic-elements-in-synthetic/363207/5 "2024-07-16T11:07:54Z")

</div>

Thanks @Sachin_Chourasiya and @Anjali3 for the additional detail. I think you could use a [scripted monitor](https://www.elastic.co/guide/en/observability/current/synthetics-create-test.html) for this, with steps similar to the following:

1. Create a journey and use a [Playwright locator](https://playwright.dev/docs/locators) to pull the status value and anything else from the DOM.
2. Throw an exception for any failures to trigger a failure in the monitor.
3. Setup an [alert](https://www.elastic.co/guide/en/observability/current/synthetics-settings.html#synthetics-settings-alerting) to trigger on failure of the monitor.

I hope that makes sense.

---

<div class="post-metadata">

**Author:** ![Sachin\_Chourasiya](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/sachin_chourasiya/32/122573_2.png) [@Sachin\_Chourasiya](https://discuss.elastic.co/u/Sachin_Chourasiya)\
**Post date:** [July 16, 2024, 11:25am UTC](https://discuss.elastic.co/t/monitoring-the-dynamic-elements-in-synthetic/363207/6 "2024-07-16T11:25:28Z")

</div>

Thanks @carly.richmond for your valuable response.  
So as far as I can understand from your response you mean to say that we have to pull the status value of every job, but this seems difficult because the jobs can increase or decrease.

---

<div class="post-metadata">

**Author:** ![carly.richmond](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/carly.richmond/32/104935_2.png) [@carly.richmond](https://discuss.elastic.co/u/carly.richmond)\
**Post date:** [July 16, 2024, 1:21pm UTC](https://discuss.elastic.co/t/monitoring-the-dynamic-elements-in-synthetic/363207/7 "2024-07-16T13:21:32Z")

</div>

It's difficult to say without seeing the underlying HTML source. But it is possible to pull multiple elements using the [Playwright all selector](https://playwright.dev/docs/api/class-locator#locator-all).

It looks like the all selector was introduced in v1.29, and [I see the latest version of Elastic Synthetics uses v1.45](https://github.com/elastic/synthetics/blob/v1.10.0/package.json#L59). So it should be doable.
