v0.10.0 release is broken, tests failing about next-image-export-optimizer

[Niels-IO]

Hi @kenOfYugen,

Thanks for raising this issue. In my setup, all tests are passing. The package is working as expected in two projects. Could you please provide more information on your setup as well as the error message? I will then try to find the issue.

Thanks!

[kenOfYugen]

Maybe I am running the tests wrong then 😅?

I am on Mac OS X 10.14.3
$ node -v v18.0.0
$ npm -v 8.10.0

fresh git clone https://github.com/Niels-IO/next-image-export-optimizer, npm i, npm t produces this output:

> jest

 FAIL  test/optimizeImages.test.js (50.612 s)
  ✕ Optimize images (50068 ms)

  ● Optimize images

    expect(received).toMatchInlineSnapshot(snapshot)

    Snapshot name: `Optimize images 5`

    - Snapshot  - 15
    + Received  + 15

      Array [
        100,
    -   40250,
    -   45584,
    -   2338,
    +   40418,
    +   45568,
    +   2352,
        136,
    -   84746,
    -   93116,
    -   5944,
    -   338,
    -   10326,
    -   219028,
    -   582,
    -   864,
    -   19852,
    -   25344,
    -   28734,
    -   1504,
    +   85030,
    +   93140,
    +   5906,
    +   342,
    +   10304,
    +   219286,
    +   578,
    +   882,
    +   19842,
    +   25324,
    +   28758,
    +   1514,
      ]

      158 |     }
      159 |     if (index == 0) {
    > 160 |       expect(imageFileStats).toMatchInlineSnapshot(`
          |                              ^
      161 | Array [
      162 |   100,
      163 |   40250,

      at Object.toMatchInlineSnapshot (test/optimizeImages.test.js:160:30)

  ● Optimize images

    expect(received).toMatchInlineSnapshot(snapshot)

    Snapshot name: `Optimize images 6`

    - Snapshot  - 17
    + Received  + 17

      Array [
    -   150,
    -   107796,
    -   122246,
    -   6466,
    -   288,
    -   243172,
    -   270284,
    -   15916,
    -   804,
    -   26670,
    -   865700,
    -   1524,
    -   2454,
    -   51958,
    -   63890,
    -   75022,
    -   4428,
    +   148,
    +   107646,
    +   121736,
    +   6478,
    +   282,
    +   242404,
    +   270090,
    +   15934,
    +   806,
    +   26660,
    +   866440,
    +   1512,
    +   2462,
    +   52038,
    +   63662,
    +   74588,
    +   4448,
      ]

      180 | `);
      181 |     } else if (index === 1) {
    > 182 |       expect(imageFileStats).toMatchInlineSnapshot(`
          |                              ^
      183 | Array [
      184 |   150,
      185 |   107796,

      at Object.toMatchInlineSnapshot (test/optimizeImages.test.js:182:30)

 › 2 snapshots failed.
Snapshot Summary
 › 2 snapshots failed from 1 test suite. Inspect your code changes or run `npm test -- -u` to update them.

Test Suites: 1 failed, 1 total
Tests:       1 failed, 1 total
Snapshots:   2 failed, 4 passed, 6 total
Time:        50.765 s
Ran all test suites.

The project that uses next-image-export-optimizer is running with next 12.1.6
The runtime error after updating next-image-export-optimizer to v0.10.0 release is the following:

Unhandled Runtime Error

TypeError: filePath.split is not a function
Call Stack
splitFilePath
../../node_modules/.pnpm/[email protected][email protected]/node_modules/next-image-export-optimizer/dist/ExportedImage.js (143:0)
generateImageURL
../../node_modules/.pnpm/[email protected][email protected]/node_modules/next-image-export-optimizer/dist/ExportedImage.js (154:0)
ExportedImage/automaticallyCalculatedBlurDataURL<
../../node_modules/.pnpm/[email protected][email protected]/node_modules/next-image-export-optimizer/dist/ExportedImage.js (211:0)
mountMemo
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (17091:0)
useMemo
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (17564:0)
useMemo
../../node_modules/.pnpm/[email protected]/node_modules/react/cjs/react.development.js (1648:0)
ExportedImage
../../node_modules/.pnpm/[email protected][email protected]/node_modules/next-image-export-optimizer/dist/ExportedImage.js (207:0)
renderWithHooks
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (16175:0)
mountIndeterminateComponent
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (20913:0)
beginWork
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (22416:0)
callCallback
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (4161:0)
invokeGuardedCallbackDev
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (4210:0)
invokeGuardedCallback
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (4274:0)
beginWork$1
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (27405:0)
performUnitOfWork
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (26513:0)
workLoopSync
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (26422:0)
renderRootSync
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (26390:0)
performConcurrentWorkOnRoot
../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js (25694:0)
workLoop
../../node_modules/.pnpm/[email protected]/node_modules/scheduler/cjs/scheduler.development.js (266:0)
flushWork
../../node_modules/.pnpm/[email protected]/node_modules/scheduler/cjs/scheduler.development.js (239:0)
performWorkUntilDeadline
../../node_modules/.pnpm/[email protected]/node_modules/scheduler/cjs/scheduler.development.js (533:0)

It goes away when I revert to 0.9.6

[Niels-IO]

Thanks for the additional information. The unit tests are failing most likely due to a different version of sharp.js. If you look closely at the generated sizes in the inline snapshots, they only differ by a few bytes. I will specify the newest sharp.js release in the package.json in the next release.

For the other problem: Could you please double-check that you pass a string in the src property of the ExportedImage component? What location are you specifying in your example in the src property?

[kenOfYugen]

Thanks for the additional information. The unit tests are failing most likely due to a different version of sharp.js. If you look closely at the generated sizes in the inline snapshots, they only differ by a few bytes. I will specify the newest sharp.js release in the package.json in the next release.

Please correct me if I am wrong, but doesn't npm ci respect the version of sharp specified inside package-lock.json? How can I reproduce an environment that passes the tests?

For the other problem: Could you please double-check that you pass a string in the src property of the ExportedImage component? What location are you specifying in your example in the src property?

You are correct, there was a stray image that was not inserted properly i.e.

import logo from '../public/images/logo.png'
<ExportedImage src={logo} />

I could not identify the culprit since it just worked before updating.
Images properly inserted don't cause issues when updating to v0.10.0 release
<ExportedImage src='images/DSC09332.jpg' />

Thanks for the prompt replies, I am sorry for taking up your time.

[Niels-IO]

Please correct me if I am wrong, but doesn't npm ci respect the version of sharp specified inside package-lock.json? How can I reproduce an environment that passes the tests?

To be honest, you did it the right way. I think it was a mismatch between the specified version in the package.json and the lock-file. Not sure if pnpm does something different in the lock-file definition.

Thanks for the prompt replies, I am sorry for taking up your time.

Don't worry, I am happy about feedback :)