CtrlK
CommunityDocumentationLog inGet started
Tessl Logo

tessl/npm-gatsby-plugin-sharp

Wrapper of the Sharp image manipulation library for Gatsby plugins

58%

Overall

Evaluation58%

1.07x

Agent success when using this tile

Overview
Eval results
Files

rubric.jsonevals/scenario-4/

{
  "context": "This criteria evaluates how well the engineer uses gatsby-plugin-sharp to query and retrieve responsive image data from Gatsby's GraphQL layer. The focus is on proper GraphQL query construction, correct usage of gatsbyImageData field, and appropriate handling of image transformation options.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "GraphQL Query Structure",
      "description": "Uses Gatsby's graphql function to query the File node type with appropriate filters (e.g., relativePath filter) to locate the target image file.",
      "max_score": 20
    },
    {
      "name": "gatsbyImageData Field Usage",
      "description": "Queries the childImageSharp.gatsbyImageData field (provided by gatsby-plugin-sharp) to retrieve responsive image transformation data.",
      "max_score": 25
    },
    {
      "name": "Layout Parameter",
      "description": "Correctly passes the layout parameter (CONSTRAINED or FULL_WIDTH) to the gatsbyImageData field based on the options provided to the query function.",
      "max_score": 15
    },
    {
      "name": "Format Specification",
      "description": "Correctly specifies the formats parameter in the gatsbyImageData query using the formats array from options (e.g., [AUTO, WEBP, AVIF]).",
      "max_score": 15
    },
    {
      "name": "Width Parameter",
      "description": "Appropriately passes the width parameter to gatsbyImageData when using constrained layout, controlling the maximum image width.",
      "max_score": 10
    },
    {
      "name": "Image Data Extraction",
      "description": "Correctly extracts and returns the images, layout, width, height, and other properties from the gatsbyImageData result object, including the sources array with format-specific srcSet data.",
      "max_score": 10
    },
    {
      "name": "Error Handling",
      "description": "Properly handles cases where the image file is not found or childImageSharp is null, returning null as specified rather than throwing an error.",
      "max_score": 5
    }
  ]
}
tessl i tessl/npm-gatsby-plugin-sharp@5.15.0

tile.json