Got error "extract_area: bad extract area" when using `rotate()` when using 0.31.0

Possible bug

Is this a possible bug in a feature of sharp, unrelated to installation?

• Running npm install sharp completes without error.
• Running node -e "require('sharp')" completes without error.

If you cannot confirm both of these, please open an installation issue instead.

Are you using the latest version of sharp?

• I am using the latest version of sharp as reported by npm view sharp dist-tags.latest.

If you cannot confirm this, please upgrade to the latest version and try again before opening an issue.

If you are using another package which depends on a version of sharp that is not the latest, please open an issue against that package instead.

What is the output of running npx envinfo --binaries --system --npmPackages=sharp --npmGlobalPackages=sharp?

  System:
    OS: macOS 12.5
    CPU: (6) x64 Intel(R) Core(TM) i5-8500B CPU @ 3.00GHz
    Memory: 120.48 MB / 16.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 16.15.1 - ~/.nvm/versions/node/v16.15.1/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 8.13.2 - ~/.nvm/versions/node/v16.15.1/bin/npm
    Watchman: 2022.09.05.00 - /usr/local/bin/watchman
  npmPackages:
    sharp: ^0.31.0 => 0.31.0

What are the steps to reproduce?

I’ve created a short script to reproduce the bug. Only sharp is used as deps.

const fs = require('fs')
const sharp = require('sharp')

const image = fs.readFileSync('20171031_PAR.jpg')

const cropAndResize = async (buffer, width, height, topleftX, topleftY, ratio) => {
  const { width: actualWidth, height: actualHeight } = await sharp(buffer).rotate().metadata()

  const newTopleftX = Math.round(topleftX) / 100
  const newTopleftY = Math.round(topleftY) / 100
  const newRatio = ratio / 100
  const left = newTopleftX * actualWidth
  const top = newTopleftY * actualHeight
  const widthToCrop = Math.min(newRatio * actualWidth, actualWidth - left)
  const heightToCrop = Math.min((newRatio * actualWidth) / (width / height), actualHeight - top)

  console.log({
    left: left ? Math.round(left) : 0,
    top: top ? Math.round(top) : 0,
    width: Math.round(widthToCrop),
    height: Math.round(heightToCrop),
    actualWidth,
    actualHeight,
  })

  const newBuffer = await sharp(buffer)
    .rotate()
    .extract({
      left: left ? Math.round(left) : 0,
      top: top ? Math.round(top) : 0,
      width: Math.round(widthToCrop),
      height: Math.round(heightToCrop),
    })
    .resize({
      height: height ? Number(height) : height,
      width: Number(width),
      withoutEnlargement: true,
    })
    .jpeg({ quality: 80 })
    .toBuffer()

  return newBuffer
}

;(async () => {
  const res = await cropAndResize(image, 100, 80, 0, 19, 100)

  console.log(res)
})()

I’m using that image for my test (called 20171031_PAR.jpg in the script).

What is the expected behaviour?

It should log the Buffer after rotate + extract + resize.

Instead I got:

node:internal/process/promises:279
            triggerUncaughtException(err, true /* fromPromise */);
            ^

[Error: extract_area: bad extract area
]

If I remove the rotate() action (the second one used), everything went fine.

The image is 296x382. The extract info are:

• left: 0,
• top: 73,
• width: 296,
• height: 237

So the box isn’t outside the image.

There are no Orientation information in the given image, so the rotate() should do nothing (but we are using it because sometimes some images have the Orientation info).

Everything run fine on 0.30.7. The bug appears on 0.31.0

[lovell]

v0.31.1 now available

[lovell]

Re-opening until the fix is published.