如何在Cypress测试中获得Gatsby.js路由/端点的完整列表



我目前正在用Cypress为一个基于盖茨比的项目编写一些E2E测试。

特别是对于一个测试,我想循环浏览我的Gatsby网站的所有页面,为了实现这一点,我需要一个测试夹具(例如endpoints.json(,它包括一个所有url的数组。

我尝试了以下方法(但都有局限性(:

1.运行节点脚本检查src/pages文件夹中的文件夹结构

限制-这不考虑使用graphqlgatsby-node.js中动态生成的页面

2.运行节点脚本在gatsby-plugin-sitemap生成的sitemap.xml文件中抓取URL

限制-插件只在prod构建中生成了sitemap.xml文件,而没有在dev中生成(柏树运行dev服务器(

如果有人能就如何在这种环境下获得盖茨比端点的完整列表提出建议,我将不胜感激。

您可能只想在构建时使用GraphQL:中的数据生成所需格式的文件

// gatsby-node.js
const path = require("path")
const fs = require("fs").promises
exports.onPostBuild = async ({ graphql }) => {
const { data } = await graphql(`
{
pages: allSitePage {
nodes {
path
}
}
}
`)
return fs.writeFile(
path.resolve(__dirname, "all-pages.txt"),
data.pages.nodes.map(node => node.path).join("n")
)
}

这将创建一个.txt文件,每个页面的路径都在一行上。不过,您也可以通过将JSON.stringify(data.pages)作为第二个参数传递给writeFile,将数据写成JSON。

Cypress有一个非常酷的新插件,它将允许您在fixture和env变量中获取端点,称为gatsby-Cypress端点。coreyward的答案是完全有效的,但这应该允许您只有在运行Cypress时才能获得端点。

请注意,对于Gatsby的最新版本(特别是v3(,您可能必须设置env变量CI=true才能使建议的解决方案发挥作用。

我相信这是因为对开发经验的改变;查询是按需处理的,而不是预先处理的。

以下标志FAST_DEV/QUERY_ON_DEMAND可能对这种行为负责。

最新更新