00:00:00Playwrights CLI is the newest way to use Playwrights with your coding agent, allowing you to manage
00:00:04local and session storage, take snapshots, manage tabs – basically the full power of
00:00:09the Playwrights engine inside your terminal.
00:00:12But why would anyone use this instead of using the Playwrights MCP server?
00:00:17In fact, why are more CLIs being built from tools that were previously MCP servers?
00:00:22Hit subscribe and let's get into it.
00:00:24Let's start off by testing both the Playwrights CLI and MCP server on one simple task.
00:00:31I'm going to ask it to help me test a tool I've been working on to download videos from
00:00:35Twitter.
00:00:36I'm going to ask Playwright to grab the link for this tweet, paste it here, extract the
00:00:40video, then wait for 10 seconds before taking a screenshot, and then clearing local storage
00:00:45so that the next agent can have a fresh slate.
00:00:48We'll first try it with the Playwrights CLI using Clawed Code, and if we install it, we
00:00:54should have the skill available here.
00:00:56Notice it only takes up 68 tokens.
00:00:59So now I'm going to give it this prompt, which tells the agent explicitly to use the
00:01:03Playwrights CLI skill, just to make things a bit easier.
00:01:06So now I'll hit enter, then it loads the skill, puts this URL into the text box, clicks
00:01:11Extract Video, then it's going to wait for 10 seconds.
00:01:13Now it's taken the screenshot, cleared local storage, and it's closed the browser.
00:01:17So now it's all done, it says the screenshot is saved here, and if we take a look at it,
00:01:21we can see it shows the video was successfully downloaded.
00:01:24And the whole thing has used up around 16% of the tokens.
00:01:27Now let's try the same thing using the MCP server.
00:01:29We can use the MCP command to check that we have it installed.
00:01:33And before we go ahead and do that, let's take a look at the context.
00:01:35And if you scroll up, we can see that already 15% of the context is being used, because all
00:01:41of these MCP tools are being loaded, which use about 3.6K tokens.
00:01:46Okay, so with that in mind, we're going to use the same prompt.
00:01:50And notice I'm using the Playwright MCP server tools, instead of using the CLI skill.
00:01:55So it's gone ahead to use the MCP server, which opens up a new browser.
00:01:59Then it's pasted the link into the input.
00:02:01Then it's going to click the button.
00:02:02I've noticed the MCP server asks for way more permissions than the CLI does, which is fine.
00:02:08And it's had a few issues taking the screenshot, which may be because I already have a file
00:02:12with this name.
00:02:13I actually tried it again with the Playwright MCP server, and even though it tried with a
00:02:17different screenshot name, it had issues multiple times trying to extract a screenshot.
00:02:22And now it's finished.
00:02:23It was able to do everything apart from take the screenshot.
00:02:26But let's now take a look at the context, and we can see it's used up 35K, which is 18%.
00:02:32So just a tiny bit more than the CLI, the bulk of which was taken up by the MCP tools.
00:02:37But there's actually a way to do the exact same set of tasks and use slightly less context,
00:02:43which I'll talk about a bit later on in the video.
00:02:45Now I know this is just one example, and there may even be scenarios where the MCP server
00:02:51uses less tokens than the Playwright CLI, depending on the task, although I doubt it.
00:02:56And you may even be thinking, well, the difference between 16 and 18% isn't that much.
00:03:02But the CLI does have other advantages over the MCP server.
00:03:06By default, the Playwright MCP server doesn't expose all the available tools.
00:03:11In fact, you'd have to opt into extra tools like PDF generation or tracing in order to
00:03:16use them because they take up too much context.
00:03:19The CLI, however, doesn't have that limitation.
00:03:22In fact, all the tools are available from the get go.
00:03:25And the CLI isn't just good for agents, it's also good for humans, because for tasks you
00:03:29do over and over again, or even for end to end testing, you can create a simple bash script
00:03:34that a human can run to verify the results, but also an agent can run as well.
00:03:39But this doesn't mean the MCP server is useless, because if you're building an agent loop
00:03:44you want to run anywhere, so in the browser, on desktop and mobile apps, not just in the
00:03:49terminal, then the MCP server is perfect for that, because it's a standard protocol that
00:03:54agents use to access tools, and because Playwright runs JavaScript or TypeScript code, you can
00:03:59run this code in any environment that supports the JavaScript runtime.
00:04:03Also, the MCP server runs in headers mode by default, whereas the CLI runs in headless mode,
00:04:09since it's designed to run in the background, encoding agents.
00:04:13And if you do care about reducing tokens in the Playwright MCP server, you can configure
00:04:17it by turning certain tools on or off.
00:04:20In fact, if your aim is to use as little tokens as possible, then you shouldn't use the Playwright's
00:04:26CLI either, because the cell's agent browser runs Playwright under the hood, but has a Rust
00:04:32CLI, making it faster, and is designed to use less tokens than Playwright, as you saw in
00:04:38my earlier example.
00:04:39Check out the next video to learn all about Agent Browser and take your coding agents browsing
00:04:43skills to the next level.