mirror of
https://github.com/ThatGuySam/doesitarm.git
synced 2026-05-18 06:44:46 -07:00
update: initial vitest refactor for listings
This commit is contained in:
ThatGuySam
parent
559e47c8fa
commit
a232a1b49d
2 changed files with 229 additions and 248 deletions
|
|
@ -1,248 +0,0 @@
|
||||||
import fs from 'fs-extra'
|
|
||||||
import has from 'just-has'
|
|
||||||
import test from 'ava'
|
|
||||||
import axios from 'axios'
|
|
||||||
import { JSDOM } from 'jsdom'
|
|
||||||
import { structuredDataTestHtml } from 'structured-data-testing-tool'
|
|
||||||
import { Google } from 'structured-data-testing-tool/presets'
|
|
||||||
|
|
||||||
|
|
||||||
import {
|
|
||||||
makeApiPathFromEndpoint,
|
|
||||||
getVideoImages,
|
|
||||||
ListingDetails
|
|
||||||
} from '~/helpers/listing-page.js'
|
|
||||||
import { headPropertyTypes } from '~/test/helpers/head.js'
|
|
||||||
import { PageHead } from '~/helpers/config-node.js'
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const listingsCases = {
|
|
||||||
|
|
||||||
// Spotify
|
|
||||||
'/app/spotify': {
|
|
||||||
endpoint: '/app/spotify',
|
|
||||||
apiEndpointPath: '/api/app/spotify.json',
|
|
||||||
expectInitialVideo: true,
|
|
||||||
shouldHaveVideoStucturedData: false,
|
|
||||||
},
|
|
||||||
|
|
||||||
// Electron
|
|
||||||
'/app/electron-framework': {
|
|
||||||
endpoint: '/app/electron-framework',
|
|
||||||
apiEndpointPath: '/api/app/electron-framework.json',
|
|
||||||
expectInitialVideo: false,
|
|
||||||
shouldHaveVideoStucturedData: false,
|
|
||||||
},
|
|
||||||
|
|
||||||
// Express VPN Benchmarks
|
|
||||||
'/app/expressvpn/benchmarks/': {
|
|
||||||
endpoint: '/app/expressvpn/benchmarks/',
|
|
||||||
apiEndpointPath: '/api/app/expressvpn.json',
|
|
||||||
expectInitialVideo: true,
|
|
||||||
shouldHaveVideoStucturedData: true
|
|
||||||
},
|
|
||||||
|
|
||||||
// Express VPN Benchmarks
|
|
||||||
'/tv/install-instagram-app-on-m1-macbook-air-apple-silicon-tutorial-i-vfbmworal6i/': {
|
|
||||||
endpoint: '/tv/install-instagram-app-on-m1-macbook-air-apple-silicon-tutorial-i-vfbmworal6i/',
|
|
||||||
apiEndpointPath: '/api/tv/install-instagram-app-on-m1-macbook-air-apple-silicon-tutorial-i-vfbmworal6i.json',
|
|
||||||
expectInitialVideo: true,
|
|
||||||
shouldHaveVideoStucturedData: true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const listingCaseEntries = Object.entries( listingsCases )
|
|
||||||
|
|
||||||
test.before(async t => {
|
|
||||||
|
|
||||||
t.context.listings = {}
|
|
||||||
|
|
||||||
for ( const [ caseEndpoint, listingCase ] of listingCaseEntries ) {
|
|
||||||
const { endpoint } = listingCase
|
|
||||||
|
|
||||||
const apiPath = makeApiPathFromEndpoint( caseEndpoint )
|
|
||||||
const localPath = `./static${ apiPath }`
|
|
||||||
|
|
||||||
// Check if the endpoint exists locally
|
|
||||||
// so we don't have to wait for the API
|
|
||||||
if ( await fs.pathExists( localPath ) ) {
|
|
||||||
console.log('Using local endpoint data for', endpoint)
|
|
||||||
t.context.listings[ caseEndpoint ] = await fs.readJson( localPath )
|
|
||||||
continue
|
|
||||||
}
|
|
||||||
|
|
||||||
const { data } = await axios.get(`${ process.env.PUBLIC_API_DOMAIN }${ apiPath }`)
|
|
||||||
|
|
||||||
t.context.listings[ caseEndpoint ] = data
|
|
||||||
}
|
|
||||||
|
|
||||||
t.context.listingsDetails = {}
|
|
||||||
|
|
||||||
for ( const [ caseEndpoint ] of listingCaseEntries ) {
|
|
||||||
t.context.listingsDetails[ caseEndpoint ] = new ListingDetails( t.context.listings[ caseEndpoint ] )
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
function parseHTML ( htmlString ) {
|
|
||||||
const dom = new JSDOM( htmlString )
|
|
||||||
|
|
||||||
return {
|
|
||||||
dom,
|
|
||||||
window: dom.window,
|
|
||||||
document: dom.window.document
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
test( 'Listings have valid api endpoints', async t => {
|
|
||||||
const { listingsDetails } = t.context
|
|
||||||
|
|
||||||
for ( const [ caseEndpoint, listingCase ] of listingCaseEntries ) {
|
|
||||||
|
|
||||||
const apiPath = listingsDetails[ caseEndpoint ].apiEndpointPath
|
|
||||||
|
|
||||||
t.assert( listingCase.apiEndpointPath === apiPath, `${ caseEndpoint } has a valid api endpoint` )
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
test( 'Listings with videos have preload data for initialVideo', async t => {
|
|
||||||
const { listingsDetails } = t.context
|
|
||||||
|
|
||||||
for ( const [ caseEndpoint, listingCase ] of listingCaseEntries ) {
|
|
||||||
|
|
||||||
const listingDetails = listingsDetails[ caseEndpoint ]
|
|
||||||
|
|
||||||
t.assert( listingDetails.hasInitialVideo === listingCase.expectInitialVideo, `${ caseEndpoint } has initial video` )
|
|
||||||
|
|
||||||
// Stop here if we don't have an initial video
|
|
||||||
if ( !listingDetails.hasInitialVideo ) continue
|
|
||||||
|
|
||||||
// t.log('listingDetails.initialVideo', listingDetails.initialVideo)
|
|
||||||
|
|
||||||
// Get headProperties for image preloading
|
|
||||||
const preloadHeadChecks = headPropertyTypes[ 'link[rel="preload"]' ]
|
|
||||||
|
|
||||||
const images = getVideoImages( listingDetails.initialVideo )
|
|
||||||
|
|
||||||
// Check if the head object properties are correct
|
|
||||||
for ( const preload of images.preloads ) {
|
|
||||||
for ( const [ propertyName, checkMethod ] of Object.entries( preloadHeadChecks ) ) {
|
|
||||||
// Skip count property
|
|
||||||
if ( propertyName === 'count' ) continue
|
|
||||||
|
|
||||||
const value = preload[ propertyName ]
|
|
||||||
|
|
||||||
t.assert( checkMethod( value ), `${ propertyName } failed. Value is '${ value }' for '${ images.imgSrc }'` )
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
test('Listings have valid headings', async t => {
|
|
||||||
const { listingsDetails } = t.context
|
|
||||||
|
|
||||||
for ( const [ caseEndpoint, listingCase ] of listingCaseEntries ) {
|
|
||||||
|
|
||||||
|
|
||||||
// Build listing details
|
|
||||||
const listingDetails = listingsDetails[ caseEndpoint ]
|
|
||||||
const listingPageHead = new PageHead( listingDetails.headOptions )
|
|
||||||
|
|
||||||
// console.log( 'pageMeta', listingPageHead.metaMarkup )
|
|
||||||
|
|
||||||
// Parse into dom
|
|
||||||
// so we can get data via selectors
|
|
||||||
const { document } = parseHTML( listingPageHead.metaAndLinkMarkup )
|
|
||||||
|
|
||||||
for ( const [ selector, checks ] of Object.entries( headPropertyTypes ) ) {
|
|
||||||
const elements = document.querySelectorAll( selector )
|
|
||||||
|
|
||||||
let count = 1
|
|
||||||
|
|
||||||
if ( has( checks, 'count' ) ) {
|
|
||||||
count = checks.count
|
|
||||||
// delete checks.count
|
|
||||||
}
|
|
||||||
|
|
||||||
if ( count !== false ) {
|
|
||||||
// Fail if there's more or less than one element
|
|
||||||
t.is( elements.length, count, `${ selector } count is ${ elements.length } but should be ${ count }` )
|
|
||||||
}
|
|
||||||
|
|
||||||
for( const element of elements ) {
|
|
||||||
for ( const [ check, checkMethod ] of Object.entries( checks ) ) {
|
|
||||||
// console.log( `Ckecking ${ selector } ${ check }` )
|
|
||||||
|
|
||||||
const value = element.getAttribute( check )
|
|
||||||
|
|
||||||
t.assert( checkMethod( value ), `${ check } on ${ selector } failed. Value is '${ value }'` )
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
test( 'Listings with videos have structured data', async t => {
|
|
||||||
const { listingsDetails } = t.context
|
|
||||||
|
|
||||||
for ( const [ caseEndpoint, listingCase ] of listingCaseEntries ) {
|
|
||||||
|
|
||||||
const listingDetails = listingsDetails[ caseEndpoint ]
|
|
||||||
const listingPageHead = new PageHead( {
|
|
||||||
...listingDetails.headOptions,
|
|
||||||
pathname: caseEndpoint
|
|
||||||
})
|
|
||||||
|
|
||||||
// Stop here if we're not expecting Video Structured Data
|
|
||||||
if ( !listingCase.shouldHaveVideoStucturedData ) {
|
|
||||||
|
|
||||||
// Check that the non-video listing doesn't have video structured data
|
|
||||||
t.assert( !listingPageHead.structuredDataMarkup.includes('VideoObject'), `${ caseEndpoint } has video structured data` )
|
|
||||||
|
|
||||||
continue
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// t.log('listingDetails.initialVideo', listingDetails.initialVideo)
|
|
||||||
// t.log( 'caseEndpoint', caseEndpoint )
|
|
||||||
|
|
||||||
// Assert that the structured data is not empty
|
|
||||||
t.assert( listingPageHead.structuredDataMarkup.trim() !== '', `${ caseEndpoint } has structured data` )
|
|
||||||
|
|
||||||
// https://github.com/glitchdigital/structured-data-testing-tool#api
|
|
||||||
const testResult = await structuredDataTestHtml( listingPageHead.allHeadMarkup , {
|
|
||||||
presets: [ Google ],
|
|
||||||
schemas: [ 'VideoObject' ]
|
|
||||||
}).then(res => {
|
|
||||||
return res
|
|
||||||
}).catch(err => {
|
|
||||||
// console.warn( 'Structured Data error', err.error )
|
|
||||||
|
|
||||||
if (err.type === 'VALIDATION_FAILED') {
|
|
||||||
|
|
||||||
// t.fail( 'Some structured data tests failed.' )
|
|
||||||
const validationError = new Error( 'Some structured data tests failed.' )
|
|
||||||
|
|
||||||
validationError.failed = err.res.failed
|
|
||||||
validationError.errors = Array.from( err.res.failed ).map( fail => fail.error )
|
|
||||||
|
|
||||||
throw validationError
|
|
||||||
|
|
||||||
// return
|
|
||||||
}
|
|
||||||
|
|
||||||
throw new Error( 'Structured data testing error.', err.error )
|
|
||||||
})
|
|
||||||
|
|
||||||
// t.log( 'testResult', testResult )
|
|
||||||
|
|
||||||
// Assert that no Structured Data tests failed
|
|
||||||
t.assert( testResult.failed.length === 0, `${ caseEndpoint } has valid structured data` )
|
|
||||||
}
|
|
||||||
})
|
|
||||||
229
test/listings/index.test.ts
Normal file
229
test/listings/index.test.ts
Normal file
|
|
@ -0,0 +1,229 @@
|
||||||
|
import fs from 'fs-extra'
|
||||||
|
import has from 'just-has'
|
||||||
|
import { test, expect, beforeAll } from 'vitest'
|
||||||
|
import axios from 'axios'
|
||||||
|
import { JSDOM } from 'jsdom'
|
||||||
|
import { structuredDataTestHtml } from 'structured-data-testing-tool'
|
||||||
|
import { Google } from 'structured-data-testing-tool/presets'
|
||||||
|
|
||||||
|
import {
|
||||||
|
makeApiPathFromEndpoint,
|
||||||
|
getVideoImages,
|
||||||
|
ListingDetails
|
||||||
|
} from '~/helpers/listing-page.js'
|
||||||
|
import { headPropertyTypes } from '~/test/helpers/head.js'
|
||||||
|
import { PageHead } from '~/helpers/config-node.js'
|
||||||
|
|
||||||
|
const listingsCases = {
|
||||||
|
// Spotify
|
||||||
|
'/app/spotify': {
|
||||||
|
endpoint: '/app/spotify',
|
||||||
|
apiEndpointPath: '/api/app/spotify.json',
|
||||||
|
expectInitialVideo: true,
|
||||||
|
shouldHaveVideoStructuredData: false,
|
||||||
|
},
|
||||||
|
|
||||||
|
// Electron
|
||||||
|
'/app/electron-framework': {
|
||||||
|
endpoint: '/app/electron-framework',
|
||||||
|
apiEndpointPath: '/api/app/electron-framework.json',
|
||||||
|
expectInitialVideo: false,
|
||||||
|
shouldHaveVideoStructuredData: false,
|
||||||
|
},
|
||||||
|
|
||||||
|
// Express VPN Benchmarks
|
||||||
|
'/app/expressvpn/benchmarks/': {
|
||||||
|
endpoint: '/app/expressvpn/benchmarks/',
|
||||||
|
apiEndpointPath: '/api/app/expressvpn.json',
|
||||||
|
expectInitialVideo: true,
|
||||||
|
shouldHaveVideoStructuredData: true
|
||||||
|
},
|
||||||
|
|
||||||
|
// Express VPN Benchmarks
|
||||||
|
'/tv/install-instagram-app-on-m1-macbook-air-apple-silicon-tutorial-i-vfbmworal6i/': {
|
||||||
|
endpoint: '/tv/install-instagram-app-on-m1-macbook-air-apple-silicon-tutorial-i-vfbmworal6i/',
|
||||||
|
apiEndpointPath: '/api/tv/install-instagram-app-on-m1-macbook-air-apple-silicon-tutorial-i-vfbmworal6i.json',
|
||||||
|
expectInitialVideo: true,
|
||||||
|
shouldHaveVideoStructuredData: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const listingCaseEntries = Object.entries(listingsCases)
|
||||||
|
|
||||||
|
interface TestContext {
|
||||||
|
listings: Record<string, any>;
|
||||||
|
listingsDetails: Record<string, ListingDetails>;
|
||||||
|
}
|
||||||
|
|
||||||
|
let context: TestContext = {
|
||||||
|
listings: {},
|
||||||
|
listingsDetails: {}
|
||||||
|
}
|
||||||
|
|
||||||
|
beforeAll(async () => {
|
||||||
|
for (const [caseEndpoint, listingCase] of listingCaseEntries) {
|
||||||
|
const { endpoint } = listingCase
|
||||||
|
const apiPath = makeApiPathFromEndpoint(caseEndpoint)
|
||||||
|
const localPath = `./static${apiPath}`
|
||||||
|
|
||||||
|
// Check if endpoint exists locally to avoid API calls
|
||||||
|
if (await fs.pathExists(localPath)) {
|
||||||
|
console.log('Using local endpoint data for', endpoint)
|
||||||
|
context.listings[caseEndpoint] = await fs.readJson(localPath)
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
const { data } = await axios.get(`${process.env.PUBLIC_API_DOMAIN}${apiPath}`)
|
||||||
|
context.listings[caseEndpoint] = data
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initialize listing details
|
||||||
|
for (const [caseEndpoint] of listingCaseEntries) {
|
||||||
|
context.listingsDetails[caseEndpoint] = new ListingDetails(context.listings[caseEndpoint])
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function parseHTML(htmlString: string) {
|
||||||
|
const dom = new JSDOM(htmlString)
|
||||||
|
return {
|
||||||
|
dom,
|
||||||
|
window: dom.window,
|
||||||
|
document: dom.window.document
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
test('Listings have valid api endpoints', async () => {
|
||||||
|
const { listingsDetails } = context
|
||||||
|
|
||||||
|
for (const [caseEndpoint, listingCase] of listingCaseEntries) {
|
||||||
|
const apiPath = listingsDetails[caseEndpoint].apiEndpointPath
|
||||||
|
expect(listingCase.apiEndpointPath).toBe(apiPath)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
test.todo('Listings with videos have preload data for initialVideo', async () => {
|
||||||
|
const { listingsDetails } = context
|
||||||
|
|
||||||
|
for (const [caseEndpoint, listingCase] of listingCaseEntries) {
|
||||||
|
const listingDetails = listingsDetails[caseEndpoint]
|
||||||
|
|
||||||
|
expect(
|
||||||
|
listingDetails.hasInitialVideo === listingCase.expectInitialVideo,
|
||||||
|
`${caseEndpoint} has initial video`
|
||||||
|
).toBeTruthy()
|
||||||
|
|
||||||
|
// Stop here if we don't have an initial video
|
||||||
|
if (!listingDetails.hasInitialVideo) continue
|
||||||
|
|
||||||
|
// Get headProperties for image preloading
|
||||||
|
const preloadHeadChecks = headPropertyTypes['link[rel="preload"]']
|
||||||
|
const images = getVideoImages(listingDetails.initialVideo)
|
||||||
|
|
||||||
|
// Check if the head object properties are correct
|
||||||
|
for (const preload of images.preloads) {
|
||||||
|
for (const [propertyName, checkMethod] of Object.entries(preloadHeadChecks)) {
|
||||||
|
// Skip count property
|
||||||
|
if (propertyName === 'count') continue
|
||||||
|
|
||||||
|
const value = preload[propertyName]
|
||||||
|
expect(
|
||||||
|
checkMethod,
|
||||||
|
`${propertyName} failed. Value is '${value}' for '${images.imgSrc}'`
|
||||||
|
).toBeTruthy()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
test.todo('Listings have valid headings', async () => {
|
||||||
|
const { listingsDetails } = context
|
||||||
|
|
||||||
|
for (const [caseEndpoint] of listingCaseEntries) {
|
||||||
|
// Build listing details
|
||||||
|
const listingDetails = listingsDetails[caseEndpoint]
|
||||||
|
const listingPageHead = new PageHead(listingDetails.headOptions)
|
||||||
|
|
||||||
|
// Parse into dom so we can get data via selectors
|
||||||
|
const { document } = parseHTML(listingPageHead.metaAndLinkMarkup)
|
||||||
|
|
||||||
|
for (const [selector, checks] of Object.entries(headPropertyTypes)) {
|
||||||
|
const elements = document.querySelectorAll(selector)
|
||||||
|
|
||||||
|
let count = 1
|
||||||
|
if (has(checks, 'count')) {
|
||||||
|
count = checks.count
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( count !== 0 ) {
|
||||||
|
// Fail if there's more or less than one element
|
||||||
|
expect(
|
||||||
|
elements.length,
|
||||||
|
`${selector} count is ${elements.length} but should be ${count}`
|
||||||
|
).toBe(count)
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const element of elements) {
|
||||||
|
for (const [check, checkMethod] of Object.entries(checks)) {
|
||||||
|
const value = element.getAttribute(check)
|
||||||
|
expect(
|
||||||
|
checkMethod,
|
||||||
|
`${check} on ${selector} failed. Value is '${value}'`
|
||||||
|
).toBeTruthy()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
test.todo('Listings with videos have structured data', async () => {
|
||||||
|
const { listingsDetails } = context
|
||||||
|
|
||||||
|
for (const [caseEndpoint, listingCase] of listingCaseEntries) {
|
||||||
|
const listingDetails = listingsDetails[caseEndpoint]
|
||||||
|
const listingPageHead = new PageHead({
|
||||||
|
...listingDetails.headOptions,
|
||||||
|
pathname: caseEndpoint
|
||||||
|
})
|
||||||
|
|
||||||
|
// Stop here if we're not expecting Video Structured Data
|
||||||
|
if (!listingCase.shouldHaveVideoStructuredData) {
|
||||||
|
// Check that the non-video listing doesn't have video structured data
|
||||||
|
expect(
|
||||||
|
!listingPageHead.structuredDataMarkup.includes('VideoObject'),
|
||||||
|
`${caseEndpoint} has video structured data`
|
||||||
|
).toBeTruthy()
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
// Assert that the structured data is not empty
|
||||||
|
expect(
|
||||||
|
listingPageHead.structuredDataMarkup.trim() !== '',
|
||||||
|
`${caseEndpoint} has structured data`
|
||||||
|
).toBeTruthy()
|
||||||
|
|
||||||
|
try {
|
||||||
|
const testResult = await structuredDataTestHtml(
|
||||||
|
listingPageHead.allHeadMarkup,
|
||||||
|
{
|
||||||
|
presets: [Google],
|
||||||
|
schemas: ['VideoObject']
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
// Assert that no Structured Data tests failed
|
||||||
|
expect(
|
||||||
|
testResult.failed.length,
|
||||||
|
`${caseEndpoint} has valid structured data`
|
||||||
|
).toBe(0)
|
||||||
|
} catch (err) {
|
||||||
|
if (err.type === 'VALIDATION_FAILED') {
|
||||||
|
console.error({
|
||||||
|
failed: err.res.failed,
|
||||||
|
// errors: Array.from(err.res.failed).map(fail => fail?.error!)
|
||||||
|
})
|
||||||
|
throw new Error('Some structured data tests failed. ')
|
||||||
|
}
|
||||||
|
throw new Error('Structured data testing error.', err.error)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
Loading…
Add table
Add a link
Reference in a new issue