Explore generating tests with Playwright MCP Server and DeepSeek R1

#playwright #mcp #qa #ai

Introduction

As we setup the stage in Part 5 we are ready to continue exploration. Next is DeepSeek R1.

Prerequisites

DeepSeek R1 is selected as a model
The following prompt is run:

Create a test case utilizing provided constants for navigating to the web app, login, create/edit/delete an article. Try to verify the result after every major step. Use provided instructions

Generated Test Case

test.describe('Article CRUD Operations', () => {
  const CREDENTIALS = {
    username: email,
    password: password
  };
  const TEST_ARTICLE = {
    title: articleTitle,
    content: articleContent,
    updatedTitle: updatedArticleTitle,
    updatedContent: updatedArticleContent
  };

  test.beforeEach(async ({ page }) => {
    await page.goto(url);
    await page.getByRole('link', { name: 'Sign in' }).click();
    await page.getByPlaceholder('Email').fill(CREDENTIALS.username);
    await page.getByPlaceholder('Password').fill(CREDENTIALS.password);
    await page.getByRole('button', { name: 'Sign in' }).click();
    await expect(page.getByRole('link', { name: 'New Article' })).toBeVisible();
  });

  test('Create/edit/delete article', async ({ page }) => {
    // Create
    await page.getByRole('link', { name: 'New Article' }).click();
    await page.getByPlaceholder('Article Title').fill(TEST_ARTICLE.title);
    await page.getByPlaceholder('What\'s this article about?').fill(articleAbout);
    await page.getByPlaceholder('Write your article').fill(TEST_ARTICLE.content);
    await page.getByRole('button', { name: 'Publish Article' }).click();
    await expect(page.getByRole('heading', { name: TEST_ARTICLE.title })).toBeVisible();

    // Edit
    await page.getByRole('link', { name: 'Edit Article' }).first().click();
    await page.getByPlaceholder('Article Title').fill(TEST_ARTICLE.updatedTitle);
    await page.getByPlaceholder('What\'s this article about?').fill(updatedArticleAbout);
    await page.getByPlaceholder('Write your article').fill(TEST_ARTICLE.updatedContent);
    await page.getByRole('button', { name: 'Publish Article' }).click();
    await expect(page.getByRole('heading', { name: TEST_ARTICLE.updatedTitle })).toBeVisible();

    // Delete
    await page.getByRole('button', { name: 'Delete Article' }).first().click();
    await expect(page.getByText(TEST_ARTICLE.updatedTitle)).not.toBeVisible();
  });
});

NOTE The provided example was generated from the first time. Only update which was needed to be made was to change button name from 'Update Article' to 'Publish Article' in Edit Article step due to wrong locator setup.

Pros of lacking design pattern

Readable and easy to follow
Good choice for creating POC (Proof of Concept)

Cons of lacking design pattern

Lack of abstraction
Lack of scalability for larger suites
Become very fast unmaintainable

What's next?

Stay tuned for next article in which we will experiment with newly introduced Claude 4 Opus and Claude 4 Sonnet.
Please, do not hesitate to start conversation regarding the test or it's result.

🙏🏻 Thank you for reading! Building robust, scalable automation frameworks is a journey best taken together. If you found this article helpful, consider joining a growing community of QA professionals 🚀 who are passionate about mastering modern testing.

Join the community and get the latest articles and tips by signing up for the newsletter.