how to enable input field using playwright

Question

I have a disabled input field, and I want to enable it using Playwright.

 <form action="/action_page.php">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname" disabled>
  <input type="submit" value="Submit">
</form> 

I want to check if a low permission level user enables it through dev-tools, the submit form would block/fail.

Please note that I'm unable to execute direct API calls to test that.

Answer 1

I've found a solution using the evaluate method.
The evaluate method allows you to execute JavaScript code in the context of the browser.

In this case I'm using it to remove the disabled attribute of the input field:

const inputSelector = "#fname";
await page.locator(inputSelector).evaluate((el) => el.removeAttribute("disabled"));