--- title: "Playwright now offers a UI mode" publication: "JavaScript Weekly" issue: 631 published_at: "2023-03-24" canonical_url: "https://javascriptweekly.com/issues/631" --- Plus GitHub updates its SSH host key, TC39 lands a new member, and people are selling GitHub stars? | #​631 — March 24, 2023 [Read on the Web](https://javascriptweekly.com/issues/631) Together with [![Bryntum\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_560,h_100/e_make_transparent/co_white,e_outline:7/hs9vs3jkbbbrfz0twgvk.png)](https://bryntum.com/products/grid/?utm_source=newsletter&utm_medium=email&utm_id=jsweekly-primary-20230314-grid) JavaScript Weekly [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/kbzwsvo1eytwa90htzw8.jpg)](https://marvinh.dev/blog/speeding-up-javascript-ecosystem-part-4/) [Speeding Up the JavaScript Ecosystem: npm Scripts](https://marvinh.dev/blog/speeding-up-javascript-ecosystem-part-4/) — The latest in what has been a fascinating series on finding ‘low hanging fruit’ when it comes to performance in the JavaScript world. The author explains it best himself: > _“‘npm scripts’ are executed by JavaScript developers … all the time. Despite their high usage they are not particularly well optimized and add about 400ms of overhead. In this article we were able to bring that down to ~22ms.”_ What Marvin does here is a valuable skill for all developers to pick up, and you can enjoy more by going back to [the start](https://marvinh.dev/blog/speeding-up-javascript-ecosystem/). Marvin Hagemeister [Playwright v1.32 – Now with UI Mode](https://github.com/microsoft/playwright/releases/tag/v1.32.0) — The popular Web testing and automation framework is taking more steps toward ground currently served by tools like Cypress by offering a ‘UI mode’ that lets you explore, run and debug tests in a UI environment, complete with watch mode. [▶️ This video](https://www.youtube.com/watch?v=jF0yA-JLQW0) provides a good introduction. Microsoft [![\](https://copm.s3.amazonaws.com/7f378b1a.png)](https://bryntum.com/products/grid/?utm_source=newsletter&utm_medium=email&utm_id=jsweekly-primary-20230314-grid) [A Grid Component with All the Features & Great Performance](https://bryntum.com/products/grid/?utm_source=newsletter&utm_medium=email&utm_id=jsweekly-primary-20230314-grid) — Try our powerful JS data grid component which lets you edit, sort, group and filter datasets with fantastic performance. Includes a TreeGrid, API docs and plenty of demos. Seamless integration with React, Angular & Vue apps. Bryntum sponsor [Why We Added `package.json` Support to Deno](https://deno.com/blog/package-json-support) — Deno shares some provenance with Node.js but till recently it hadn't focused on supporting Node features like npm modules. But with Node and npm compatibility beginning to improve, the team has faced questions about the runtime’s priorities. Ryan Dahl explains more about their thinking here. Ryan Dahl 📢 In other Deno news, [Deno 1.32](https://deno.com/blog/v1.32) has been released with... improved `package.json` support, and more. [How to Start a React Project in 2023](https://www.robinwieruch.de/react-starter/) — There are lots of ways, but this well-regarded author explains the pros and cons of a few approaches, and gives you a few options targeting specific use cases you might have. Robin Wieruch **IN BRIEF:** - GitHub [had to update its RSA SSH host key today](https://github.blog/2023-03-23-we-updated-our-rsa-ssh-host-key/) so you may see security related warnings when pushing and cloning. It's easy to fix, but check the new fingerprint [matches](https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/githubs-ssh-key-fingerprints) – it's for your own security. - _The New Stack_ caught up with Svelte's Rich Harris [on SvelteKit and what's coming for Svelte 4](https://thenewstack.io/rich-harris-talks-sveltekit-and-whats-next-for-svelte/). - The React team shared some [cutting edge updates on what they're working on](https://react.dev/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023) including React Server Components and an optimizing compiler. - If you were experiencing errors on the official Node site last week, [here's the (detailed) post mortem of why](https://nodejs.org/en/blog/announcements/node-js-march-17-incident). Config errors and inappropriate caching, mostly. - ✨ Did you know there's a market in fake GitHub stars? Some developers [analyzed some repos to learn more about it](https://dagster.io/blog/fake-stars). - 🥇 Congratulations to Lea Verou on [her TC39 appointment.](https://twitter.com/LeaVerou/status/1639043004190031876) Her efforts to push the Web forward are legendary. [Prism](https://prismjs.com/) is one project you may be aware of. - Make your opinions known on [what should be in the next version of Vite](https://github.com/vitejs/vite/discussions/12466). **RELEASES:** - [Docusaurus 2.4](https://github.com/facebook/docusaurus) ↳ Easy to maintain documentation site generator. - [Puppeteer 19.8](https://github.com/puppeteer/puppeteer/releases/tag/puppeteer-core-v19.8.0) ↳ Headless Chrome Node.js API. - [Neutralinojs 4.11](https://github.com/neutralinojs/neutralinojs/releases/tag/v4.11.0) ↳ Lightweight cross-platform desktop app framework. - [Qwik 0.23](https://github.com/BuilderIO/qwik/releases/tag/v0.23.0) 📒 Articles & Tutorials [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/g65e63dqdnge0er0zvue.jpg)](https://maciekpalmowski.dev/buying-a-bicycle-using-playwright/) [Buying a Hard-to-Get Bicycle using Playwright](https://maciekpalmowski.dev/buying-a-bicycle-using-playwright/) — An unusual use case for JavaScript, Playwright, and GitHub Actions, but Maciek managed to buy his bike. Maciek Palmowski [Snyk Top 10: JavaScript OSS Vulnerabilities](https://go.snyk.io/snyk-top-10-js-open-source-vulnerabilities.html?utm_campaign=snyk-top-10-os-2022&utm_medium=paid-email&utm_source=cooperpress-javascript-weekly&utm_content=snyk-top-10-js-open-source-vulnerabilities) — Dive into the most prevalent critical and high open source vulnerabilities found by Snyk scans of JavaScript apps in 2022. Snyk sponsor [The 'End' of Front-End Development?](https://www.joshwcomeau.com/blog/the-end-of-frontend-development/) — A recent narrative doing the rounds suggests that large language models like GPT-4 (or even tools like [Copilot X](https://github.blog/2023-03-22-github-copilot-x-the-ai-powered-developer-experience/)) could soon put some developers out of a job — however, Josh is “_optimistic about what these AI advancements mean for the future of software development_”. Josh W. Comeau In related news, [Eric Elliott put ChatGPT through its paces](https://medium.com/javascript-scene/learning-javascript-from-chatgpt-c0baebc19ae9) to see if it would make for a good JavaScript tutor. It did well — though with mixed results. [Migrating from ts-node to Bun](https://johnnyreilly.com/migrating-from-ts-node-to-bun) — A look at adopting performance-oriented [Bun](https://bun.sh/) when you're used to using TypeScript with Node.js. John runs us through porting a console app from the ts-node approach over to Bun — “_a pretty easy process,_” he says. John Reilly ▶[A Pinia Crash Course for Beginners](https://www.youtube.com/watch?v=iuBLAdUWPtQ) — [Pinia](https://pinia.vuejs.org/) is a store / state management solution for Vue that _does_ believe in pineapple on pizza. Alexander Gekov [A Practical Guide to Getting Started with Astro](https://bejamas.io/blog/practical-guide-to-astro-js-framework/) — An extensive walkthrough of Astro that covers all the topics you’ll need to get you started. Mojtaba Seyedi [🚀 Test Website Speed Continuously and Rank Higher In Google](https://www.debugbear.com/?utm_source=newsletter&utm_medium=sponsored&utm_campaign=javascript-weekly-3) — You need a fast website to make users happy and meet Google’s Core Web Vitals metrics. Test and optimize with DebugBear. DebugBear sponsor [Automatic npm Publishing with GitHub Actions and Granular Tokens](https://httptoolkit.com/blog/automatic-npm-publish-gha/) Tim Perry [Make Sure You Do This Before Switching to Signals in Angular](https://dev.to/angular/make-sure-you-do-this-before-switching-to-signals-27m9) Jordan Powell [Six CSS Snippets Every Developer Should Know](https://web.dev/6-css-snippets-every-front-end-developer-should-know-in-2023/) Adam Argyle (Google) 🛠 Code & Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/xbmennyjdc7po4qcfqcx.jpg)](https://trace.cafe/) [trace.cafe: Easy Webperf Trace Sharing](https://trace.cafe/) — A quick way to share a performance profile saved from your DevTools, available for up to 90 days with the DevTools perf panel embedded ([see example](https://trace.cafe/t/demo)). paul irish [VueUse: A Collection of Vue Composition Utilities](https://vueuse.org/) — With over 200 functions targeting both Vue 2 and 3, there’ll be something in this suite of Composition API-based utility functions for you, whether it’s working with state, browser capabilities, animations, Electron, Firebase, and more. Anthony Fu [Don’t Let Your Issue Tracker Be a Four-Letter Word. Use Shortcut](https://shortcut.com/?utm_source=cooperJSWeekly&utm_medium=spon_nl&utm_campaign=prospecting&utm_content=fourletter) Shortcut (formerly Clubhouse.io) sponsor [OTPAuth: One Time Password (HOTP/TOTP) Library](https://github.com/hectorm/otpauth) — When you log in to a site that uses 2FA and you’re asked for some digits from an authentication app, that’s _probably_ a Time-based One-Time Password (or TOTP). This library for Node, Deno, Bun _and_ the browser lets you work with TOTPs and HOTPs from JS. Héctor Molinero Fernández [Recharts 2.5: Chart Library Built with React and D3](https://github.com/recharts/recharts) — Easy to deploy with declarative components, native SVG support, and lightweight dependency on D3. Line, bar, scatter, composed, pie, and radar charts are offered. There are [lots of examples](https://recharts.org/en-US/examples), complete with code. recharts [DOCX 8.0: Generate Word `.docx` Files from JavaScript](https://docx.js.org/) — The code to lay out documents is verbose but there’s a _lot_ of functionality. Here’s a [CodePen example](https://codepen.io/dolanmiu/pen/RwNeObg) and [release notes](https://github.com/dolanmiu/docx/releases/tag/8.0.0) – [GitHub repo.](https://github.com/dolanmiu/docx) Dolan Miu [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/pxo48xui8vefr6wlu5wl.jpg)](https://github.com/bennymi/svhighlight) [SvHighlight: Code Syntax Highlighter for Svelte](https://github.com/bennymi/svhighlight) — Powered by Highlight.js, it includes a blurring feature to focus attention on specific areas of code and you an customize it with Tailwind. Try the [interactive examples](https://svhighlight.vercel.app/) to see the effect. SvHighlight [eslint-formatter-pretty 5.0: Pretty ESLint Formatter](https://github.com/sindresorhus/eslint-formatter-pretty) — Nicer output than the default. Sort results by severity. Get stylized inline code blocks, and more. Sindre Sorhus [AWS JWT Verify: Verify JWTs Signed by Amazon Cognito](https://github.com/awslabs/aws-jwt-verify) — In both Node.js and the browser. Amazon Web Services 💻 Jobs [Software Engineer (Backend)](https://jobs.ashbyhq.com/stickermule/477eed3e-4aae-46e6-a8ab-0646dbfb11cd?utm_source=Cooperpress) — Join our "kick ass" team. Our software team operates from 17 countries and we're always looking for more exceptional engineers. Sticker Mule [Find JavaScript Jobs with Hired](https://hired.com/join/?utm_source=newsletter&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-all%29%28cooper-javascriptweekly%29&utm_content=easy-job-hunting) — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now. Hired 🧑‍💻 Got a job listing to share? _[Here's how](https://booking.cooperpress.com/jobs)_. - [melonJS 15.0](https://melonjs.org/) ↳ Mature HTML5 game engine. - [Marked 4.3](https://github.com/markedjs/marked) ↳ Markdown parser and compiler. ([Demo.](https://marked.js.org/demo/)) - [v8go 0.9](https://github.com/rogchap/v8go) ↳ Execute JavaScript from Go(lang). - [Million 2.1](https://github.com/aidenybai/million) ↳ Fast Virtual DOM to make React faster. - [Partytown 0.7.6](https://github.com/BuilderIO/partytown) ↳ Take third-party scripts off the main thread. 🎁 Bonus Item [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/pmogiiajzqgrtzihyzat.jpg)](https://make-bookmarklets.com/) [Make Bookmarklets](https://make-bookmarklets.com/) — Create and test bookmarklets directly in the browser. Makes an irritating task slightly easier if you need to do it. Cullan Luther Published by [Cooperpress](https://cooperpress.com/) and edited by [Peter Cooper](https://twitter.com/cooperx86) 'JavaScript' is a trademark of Oracle Corporation in the US We are not endorsed by or affiliated with Oracle. [Change your email address](https://javascriptweekly.com/edit_subscription/*|UID|*) or [stop getting this newsletter](https://javascriptweekly.com/leave/*|UID|*). © Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom