<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Abhishek Jain</title>
    <description>The latest articles on DEV Community by Abhishek Jain (@abhishek_jain_cd78ebe598d).</description>
    <link>https://dev.to/abhishek_jain_cd78ebe598d</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4121457%2F73dcda3e-310f-4f78-8bb6-f1aa447250c8.jpg</url>
      <title>DEV Community: Abhishek Jain</title>
      <link>https://dev.to/abhishek_jain_cd78ebe598d</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/abhishek_jain_cd78ebe598d"/>
    <language>en</language>
    <item>
      <title>3 Ways I Use AI to Auto-Generate Playwright Locators</title>
      <dc:creator>Abhishek Jain</dc:creator>
      <pubDate>Sat, 12 Sep 2026 21:27:42 +0000</pubDate>
      <link>https://dev.to/abhishek_jain_cd78ebe598d/-3-ways-i-use-ai-to-auto-generate-playwright-locators-278c</link>
      <guid>https://dev.to/abhishek_jain_cd78ebe598d/-3-ways-i-use-ai-to-auto-generate-playwright-locators-278c</guid>
      <description>&lt;p&gt;If you've maintained a Playwright suite for more than a few months, you know the real cost isn't writing tests — it's the constant locator rot. A designer tweaks a class name, a component gets refactored, and suddenly a dozen tests are red for reasons that have nothing to do with actual bugs.&lt;/p&gt;

&lt;p&gt;After 18 years in test automation — including building enterprise-scale frameworks — I've found that AI-assisted locator generation is one of the highest-leverage places to bring LLMs into a QA workflow. Here are three approaches I actually use, not just demo-ware.&lt;/p&gt;

&lt;h2&gt;
  
  
  1. AI-Assisted Locator Discovery from the DOM
&lt;/h2&gt;

&lt;p&gt;Instead of hand-picking a &lt;code&gt;data-testid&lt;/code&gt; or fighting brittle CSS selectors, I feed a snapshot of the relevant DOM section to an LLM and ask it to propose the most resilient locator strategy — prioritizing accessible roles and text over implementation-specific attributes.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Instead of guessing at a selector manually:&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;button&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;page&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;locator&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;.btn.btn-primary.mt-2.submit-btn-v2&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="c1"&gt;// Ask an AI-assisted step to suggest something resilient:&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;button&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;page&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getByRole&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;button&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;Submit Order&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The win isn't that AI "knows" your app — it's that it consistently nudges you toward Playwright's built-in resilient locator patterns (&lt;code&gt;getByRole&lt;/code&gt;, &lt;code&gt;getByLabel&lt;/code&gt;, &lt;code&gt;getByText&lt;/code&gt;) instead of the CSS-selector habits many teams fall back into under deadline pressure.&lt;/p&gt;

&lt;h2&gt;
  
  
  2. Self-Healing Locators via Fallback Chains
&lt;/h2&gt;

&lt;p&gt;When a primary locator fails during a run, rather than failing the test outright, I use an AI step to analyze the current DOM and suggest a fallback locator that matches the &lt;em&gt;original intent&lt;/em&gt; of the interaction — then logs the drift so a human confirms it later.&lt;/p&gt;

&lt;p&gt;This isn't "magic self-healing" that silently rewrites your test suite (which I'd actually caution against — silent healing can mask real regressions). It's a flagged suggestion: "Your original locator broke; here's what looks like the same element now; confirm before I update the source."&lt;/p&gt;

&lt;h2&gt;
  
  
  3. Locator Generation from Natural-Language Test Steps
&lt;/h2&gt;

&lt;p&gt;For teams writing BDD-style scenarios ("User clicks the 'Add to Cart' button"), I use AI to translate that natural language directly into a first-draft Playwright locator + action, which a human then reviews and commits.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight gherkin"&gt;&lt;code&gt;&lt;span class="nf"&gt;When &lt;/span&gt;the user clicks &lt;span class="s"&gt;"Add to Cart"&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;becomes a suggested:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;page&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getByRole&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;button&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;Add to Cart&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt; &lt;span class="p"&gt;}).&lt;/span&gt;&lt;span class="nf"&gt;click&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This dramatically speeds up onboarding less-experienced testers into a Playwright framework, since they're writing intent, not fighting Playwright's API surface on day one.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;The common thread across all three:&lt;/strong&gt; AI isn't replacing test design judgment — it's removing the tedious, error-prone parts of locator selection so testers can focus on &lt;em&gt;what&lt;/em&gt; to test, not &lt;em&gt;how&lt;/em&gt; to write a selector.&lt;/p&gt;

&lt;p&gt;I go deeper into all of this — plus patterns for AI-assisted test generation, flaky test triage, and building a production-grade framework end to end — in my book, &lt;strong&gt;&lt;a href="https://kdp.amazon.com/amazon-dp-action/us/dualbookshelf.marketplacelink/B0HJLR1W6Y" rel="noopener noreferrer"&gt;Playwright Test Automation with AI&lt;/a&gt;&lt;/strong&gt;.&lt;/p&gt;

</description>
      <category>ai</category>
      <category>automation</category>
      <category>llm</category>
      <category>testing</category>
    </item>
  </channel>
</rss>
