Cannot query field "align" on type "CoreQuoteAttributes"

[ttstauss]

trafficstars

Description

I'm getting the following error:

error - GraphQL errors: [
 {
   message: 'Cannot query field "align" on type "CoreQuoteAttributes".',
   extensions: { category: 'graphql' },
   locations: [ [Object] ]
 }
]

This goes away when I remove @faustwp/blocks from my project.

This appears to be the issue: https://github.com/WordPress/gutenberg/commit/9a80ddde2c5c4d9c0c296f582b27a7a3a6bf1ddd

Steps to reproduce

1. Update WordPress and packages to versions indicated below.
2. Ensure @faustwp/blocks is set up and used in the project.
3. Try to run dev or a build and get the error.

Additional context

No response

@faustwp/core Version

3.0.3

@faustwp/cli Version

3.0.2

FaustWP Plugin Version

1.3.2

WordPress Version

6.6.1

Additional environment details

No response

Please confirm that you have searched existing issues in the repo.

• [X] Yes

[theodesp]

Hey @ttstauss thanks for the report. I will try to reproduce but if that is the case we will have to create a new major version of blocks package since they changed the schema. In the meatime you can still provide your own implementation of CoreQuote by overriding the blocks export key 'CoreQuote' here:

https://github.com/wpengine/faustjs/blob/canary/examples/next/block-support/wp-blocks/index.js#L9

[jasonbahl]

@ttstauss I ran into this and was able to fix it with the following:

my wp-blocks/index.js looks like this:

import { CoreBlocks } from '@faustwp/blocks'

import { CoreQuote } from './CoreQuote'

const blocks = {
  ...CoreBlocks,
  CoreQuote,
}

export default blocks

Then my CoreQuote block file looks like this:

file: wp-blocks/CoreQuote.js

import { CoreBlocks } from "@faustwp/blocks";
import {gql} from "@apollo/client";
const { CoreQuote: FaustCoreQuote } = CoreBlocks;

export function CoreQuote(props) {
  return <FaustCoreQuote {...props} />;
}

CoreQuote.displayName = { ...FaustCoreQuote.displayName };
CoreQuote.config = {
    ...FaustCoreQuote.config,
    name: `CustomCoreQuoteFragment`
};
CoreQuote.fragments = {
    key: `CustomCoreQuoteFragment`,
    entry: gql`
    fragment CustomCoreQuoteFragment on CoreQuote {
      attributes {
        textAlign
        anchor
        backgroundColor
        citation
        className
        fontFamily
        fontSize
        gradient
        lock
        style
        textColor
        value
        cssClassName
      }
    }
    `
};

[jasonbahl]

fwiw, this was caused by a change in core WordPress where an attribute on the block was changed. . .so technically this is a breaking change to WordPress core that was just surfaced by the mapping of blocks to the schema.

[ttstauss]

@theodesp and @jasonbahl, this pointed me in the right direction for a fix. Thanks!

[emaxees]

Hi, how are you? I'm encountering the same issue, so I followed the steps that jasonbahl mentioned to fix this. It seems to have worked, but now I'm facing another problem and I'm not sure if it's related to that. I'm running Wordpress 6.6.1. Thank you in advance.

[jasonbahl]

@emaxees this appears to be unrelated. It looks like you have a query defined in a template with variable $databaseId but are not providing the variable to the query.

Check your wp-templates to see if you are indeed passing variables correctly.

Here's an example of a wp-template that defines a query that uses a variable:

• https://github.com/wp-graphql/acf.wpgraphql.com/blob/main/wp-templates/single-field_type.js#L27

And passes the variable to the query:

• https://github.com/wp-graphql/acf.wpgraphql.com/blob/main/wp-templates/single-field_type.js#L153-L154