Skip to content

Fix for stepByStepReport: cheerio ESM import and missing screenshot capture#5508

Open
gololdf1sh wants to merge 1 commit intocodeceptjs:4.xfrom
gololdf1sh:fix/step-by-step-report-plugin
Open

Fix for stepByStepReport: cheerio ESM import and missing screenshot capture#5508
gololdf1sh wants to merge 1 commit intocodeceptjs:4.xfrom
gololdf1sh:fix/step-by-step-report-plugin

Conversation

@gololdf1sh
Copy link
Copy Markdown

Summary

Fix two bugs in stepByStepReport plugin that made it completely non-functional in v4.x (ESM):

  • cheerio ESM import: import cheerio from 'cheerio' fails because cheerio 1.x removed the default export. Changed to import * as cheerio from 'cheerio'
  • Screenshots never captured: if (!step.test) return in persistStep() always returned early because step.test property doesn't exist on the Step class. Replaced with if (!currentTest) return which correctly checks the plugin's existing currentTest variable

How it was tested

  • Enabled plugin with { enabled: true, deleteSuccessful: false }
  • Ran a UI test with multiple steps (clicks, navigation, form fills)
  • Result: 55 PNG screenshots captured + working HTML slideshow report

Relates to #5351

@gololdf1sh
Copy link
Copy Markdown
Author

Evidence

Bug 1: Plugin crashes on load (cheerio ESM import)

Before fiximport cheerio from 'cheerio' crashes immediately, tests cannot run at all:

Could not load plugin stepByStepReport from module './plugin/stepByStepReport.js':
Could not load plugin from './plugin/stepByStepReport.js': The requested module 'cheerio' does not provide an export named 'default'
Error: Could not load plugin from './plugin/stepByStepReport.js': The requested module 'cheerio' does not provide an export named 'default'
    at loadPluginAsync (file:///node_modules/codeceptjs/lib/container.js:638:11)

Bug 2: Screenshots never captured (step.test is always undefined)

Before fix — after fixing only the cheerio import, the plugin loads but produces an empty report with 0 screenshots:

$ ls output/record_*/
index.html          # only index.html, no PNG files

The generated index.html slideshow is completely empty — no slides, no screenshots:

empty report

Root cause: persistStep() at line 201 checks if (!step.test) return but the Step class (lib/step/base.js) has no test property — it's never assigned anywhere in the codebase. So !step.test is always true and every screenshot is skipped.

After fix (both changes applied)

$ ls output/record_*/
0000.png  0005.png  0010.png  0015.png  0020.png  0025.png  0030.png  0035.png  0040.png  0045.png  0050.png
0001.png  0006.png  0011.png  0016.png  0021.png  0026.png  0031.png  0036.png  0041.png  0046.png  0051.png
0002.png  0007.png  0012.png  0017.png  0022.png  0027.png  0032.png  0037.png  0042.png  0047.png  0052.png
0003.png  0008.png  0013.png  0018.png  0023.png  0028.png  0033.png  0038.png  0043.png  0048.png  0053.png
0004.png  0009.png  0014.png  0019.png  0024.png  0029.png  0034.png  0039.png  0044.png  0049.png  0054.png  0055.png
index.html

$ ls -la output/record_*/*.png | wc -l
56

56 PNG screenshots (~160KB each) captured across all test steps + a working HTML slideshow.

Config used for testing

stepByStepReport: {
  enabled: true,
  deleteSuccessful: false,
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant