I used the chrome plugin to copy a layout from www.orlandohealth.com for a hero banner for testing:
this worked fuctionally but immediately started generating the following warnings from Next JS:
Warning: Invalid DOM property tabindex. Did you mean tabIndex?
at img
at ImgComponent (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/@builder.io/react/src/blocks/raw/Img.tsx:14:1)
at BuilderBlock (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/@builder.io/react/src/components/builder-block.component.tsx:723:2)
at div
at BuilderBlock (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/@builder.io/react/src/components/builder-block.component.tsx:723:2)
at div
at BuilderBlock (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/@builder.io/react/src/components/builder-block.component.tsx:723:2)
at div
at BuilderBlock (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/@builder.io/react/src/components/builder-block.component.tsx:723:2)
at div
at BasicProvider (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/@emotion/core/dist/emotion-element-c423a2c0.cjs.dev.js:45:32)
at EmotionCssPropInternal
at BuilderBlocks (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/@builder.io/react/src/components/builder-blocks.component.tsx:31:1)
at div
at div
at VariantsProvider (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/@builder.io/react/src/components/variants-provider.component.tsx:104:14)
at BuilderContent (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/@builder.io/react/src/components/builder-content.component.tsx:360:2)
at div
at BuilderComponent (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/@builder.io/react/src/components/builder-component.component.tsx:393:15)
at Page (/Users/johnhschneider/dev/orh/ohdotcom/pages/index.tsx:50:37)
at App (/Users/johnhschneider/dev/orh/ohdotcom/pages/_app.js:3:31)
at StyleRegistry (/Users/johnhschneider/dev/orh/ohdotcom/node_modules/styled-jsx/dist/index/index.js:449:36)
at PathnameContextProviderAdapter (webpack://next/dist/src/shared/lib/router/adapters.tsx:70:3)
at AppContainer (webpack://next/dist/src/server/render.tsx:699:27)
at AppContainerWithIsomorphicFiberStructure (webpack://next/dist/src/server/render.tsx:750:11)
at div
at Body (webpack://next/dist/src/server/render.tsx:1217:19)
If I remove the content pasted in from the chrome plugin the error goes away. It seems somewhere in the builder code you are using the property ‘tabindex’ vs ‘tabIndex’. Should be a super quick fix that will remove this annoying warning.
Here is a link to the page that does this:
Builder public api key
19ea4309187745989c31be6f73da25f8
Code stack you are integrating Builder with
NextJS