From aafae1f581c88c897a2323903001096a653be78e Mon Sep 17 00:00:00 2001 From: Robert Reinhard Date: Wed, 20 Nov 2024 09:27:51 -0800 Subject: [PATCH 1/3] Add failing test for img presence --- packages/contentful/cypress/component/ContentfulVisual.cy.tsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/contentful/cypress/component/ContentfulVisual.cy.tsx b/packages/contentful/cypress/component/ContentfulVisual.cy.tsx index ffa7e3b..8b3489c 100644 --- a/packages/contentful/cypress/component/ContentfulVisual.cy.tsx +++ b/packages/contentful/cypress/component/ContentfulVisual.cy.tsx @@ -84,6 +84,9 @@ describe('contentful visual entry props', () => { portraitImage: null, }} />) + // There should be no imgs rendered + cy.get('img').should('not.exist') + // Portrait asset cy.get('video').its('[0].currentSrc') .should('contain', portraitVideoAsset.url) From f368cb5352ed767c06d679af1925950bbed87444 Mon Sep 17 00:00:00 2001 From: Robert Reinhard Date: Wed, 20 Nov 2024 09:53:43 -0800 Subject: [PATCH 2/3] =?UTF-8?q?Don=E2=80=99t=20render=20a=20picture=20if?= =?UTF-8?q?=20there=20is=20no=20img=20src?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/contentful/src/lib/urlBuilding.ts | 3 +++ packages/react/src/PictureImage.tsx | 1 + 2 files changed, 4 insertions(+) diff --git a/packages/contentful/src/lib/urlBuilding.ts b/packages/contentful/src/lib/urlBuilding.ts index cc7d668..40a48c7 100644 --- a/packages/contentful/src/lib/urlBuilding.ts +++ b/packages/contentful/src/lib/urlBuilding.ts @@ -13,6 +13,9 @@ export const defaultImageLoader: ImageLoader = ({ src.portraitImage.url : src.image?.url || src.url + // If no URL found, return nothing + if (!url) return '' + // Make Contentful resizing instructions const query = new URLSearchParams({ w: String(width) }) diff --git a/packages/react/src/PictureImage.tsx b/packages/react/src/PictureImage.tsx index 9c94436..7a9ad9e 100644 --- a/packages/react/src/PictureImage.tsx +++ b/packages/react/src/PictureImage.tsx @@ -47,6 +47,7 @@ export default function PictureImage(props: PictureImageProps): ReactNode { // Make the img src url const srcUrl = makeSrcUrl(src, imageLoader) + if (!srcUrl) return null // Make array or props that will be used to make s. A `null` type is // always added to create fallback sources for native mime-type of the From 1cb6a0ed9c7462054ded549cd97135d05db5e33e Mon Sep 17 00:00:00 2001 From: Robert Reinhard Date: Wed, 20 Nov 2024 09:53:59 -0800 Subject: [PATCH 3/3] =?UTF-8?q?Add=20a=20test=20that=20a=20video=20tag=20w?= =?UTF-8?q?asn=E2=80=99t=20rendered=20when=20no=20video=20src=20provided?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/contentful/cypress/component/ContentfulVisual.cy.tsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/contentful/cypress/component/ContentfulVisual.cy.tsx b/packages/contentful/cypress/component/ContentfulVisual.cy.tsx index 8b3489c..cc5ab49 100644 --- a/packages/contentful/cypress/component/ContentfulVisual.cy.tsx +++ b/packages/contentful/cypress/component/ContentfulVisual.cy.tsx @@ -63,6 +63,9 @@ describe('contentful visual entry props', () => { portraitVideo: null, }} />) + // There should be no vidoes rendered + cy.get("video").should("not.exist"); + // Portrait asset cy.get('img').hasDimensions(VW, VW) cy.get('img').its('[0].currentSrc')