-
Notifications
You must be signed in to change notification settings - Fork 10.3k
feat(gatsby-plugin-image): Allow image helpers to take other node types #29625
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
| } | ||
|
|
||
| describe(`The image helper functions`, () => { | ||
| it(`getImage returns the same data if passed gatsbyImageData`, () => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Non-blocking, but I might make a nested describe for getImage since that's technically the object of the next few tests.
|
|
||
| export const isGatsbyImageData = ( | ||
| node: IGatsbyImageData | any | ||
| ): node is IGatsbyImageData => Boolean(node?.images?.fallback?.src) // 🦆 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is this duck comment a question? Boolean is fine, an if statement might be slightly more readable.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Oh, it's just saying that I'm duck typing here by checking for specific props. Clearly should have better comments!
|
|
||
| type ImageDataLike = FileNode | IGatsbyImageDataParent | IGatsbyImageData | ||
| export const getImage = (node: ImageDataLike): IGatsbyImageData | undefined => { | ||
| if (isGatsbyImageData(node)) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is there a reason for making isGatsbyImageData and isGatsbyImageDataParent? It seems like checking for existence inside this function would be equivalent? I noticed those functions are exported, are they meant for plugins to be able to use?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Making them type guard functions allows type narrowing in TS. I exported them so they could be unit tested, but in the end just tested the getImage function itself so I could remove the export.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ah ok. Too bad we can't get the benefit without the extra functions. Would make it easier to scan.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think it's easier to read with function name!
cc9a193 to
c608155
Compare
|
Danger run resulted in 1 fail and 1 markdown; to find out more, see the checks page. Generated by 🚫 dangerJS |
laurieontech
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks! Tests are easier to scan now :)
This allows the
getImageandgetSrchelpers to take nodes other thanFilenodes, as long as they include agatsbyImageDatafield, for exampleContentfulAssets, and allowsgetSrcto take imageData directly. It also adds a stack of unit tests, and a similargetSrcSethelper.