We migrated our landing page woovi.com from Gatsby to Next.js. Gatsby was a good idea back then, but Next.js evolved better and faster. We need to modify our landing page faster to add new products, articles and experimentation, so the migration to Next.js was worth it.
Validating if all the pages are the same
To validate that all migrated pages have the same design as the old one, we create an automation to screenshot all the pages from the old and next website, so we can easily check for "bugs"
export const snapshotPages = async (
pages: string[],
snapshotDir: string,
toRelative: (url: string) => string,
) => {
const browser = await puppeteer.launch();
if (!fs.existsSync(snapshotDir)) {
fs.mkdirSync(snapshotDir);
}
// process 10 pages at a time
await processPromisesBatch(pages, 10, async (url) => {
const page = await browser.newPage();
// eslint-disable-next-line
console.log(`Opening ${url}`);
await page.goto(url, {
waitUntil: 'networkidle2',
});
const relative = toRelative(url);
const snapshotPath = path.join(snapshotDir, relative);
const dir = path.dirname(snapshotPath);
try {
if (!fs.existsSync(dir)) {
fs.mkdirSync(dir);
}
await page.screenshot({ path: `${snapshotPath}.png`, fullPage: true });
} catch (err) {
// eslint-disable-next-line
console.log('err: ', err);
}
})
await browser.close();
};
In Short
Woovi
Woovi is a Startup that enables shoppers to pay as they like. To make this possible, Woovi provides instant payment solutions for merchants to accept orders.
If you want to work with us, we are hiring!
Photo by Ishon Studios on Unsplash
Top comments (0)