Custom Script Not Working, But Screenshot IS working with same Parameters

[joshwoodland]

I am running into an issue where I am trying to use a custom script to navigate to a website and login. Here is my script:

`// Hardcoded login credentials
const email = "*";
const password = "";

console.log(Logging in with email: ${email});

let version;

try {

// Navigate to the login page
await $page.goto("https://account.simplepractice.com/", { waitUntil: "networkidle2" });

// Click on email field and type hardcoded email
await $page.click("input#user_email");
await $page.type("input#user_email", email);

// Click on password field and type hardcoded password
await $page.click("input#user_password");
await $page.type("input#user_password", password);

// Press Enter to submit the form
await $page.keyboard.press("Enter");

// Wait for navigation and ensure the page is fully loaded
await $page.waitForNavigation({ waitUntil: "networkidle2" });

// Wait for the dashboard element to appear
await $page.waitForSelector("#dashboard", { timeout: 8000 });

// Extra wait to ensure dashboard animations finish
console.log("Waiting additional time for dashboard to fully render...");
await new Promise(resolve => setTimeout(resolve, 3000));

// Get browser version
version = await $page.browser().version();
console.log(Puppeteer running on browser version: ${version});

// Capture screenshot
let screenshot;
try {
screenshot = await $page.screenshot({
fullPage: true,
type: "png",
encoding: "base64"
});
} catch (screenshotError) {
console.error("Screenshot failed:", screenshotError);
screenshot = null;
}

// Log successful login
console.log(Login successful for email: ${email});

// Return data in n8n format
return [{
json: {
success: true,
message: Login successful for email: ${email},
browserVersion: version
},
binary: screenshot ? {
screenshot: {
data: screenshot,
mimeType: "image/png",
fileName: "screenshot.png"
}
} : {}
}];
} catch (error) {
console.error("Error during login process:", error);

// Capture screenshot in case of error
let errorScreenshot;
try {
errorScreenshot = await $page.screenshot({
fullPage: true,
type: "png",
encoding: "base64"
});
} catch (screenshotError) {
console.error("Error screenshot failed:", screenshotError);
errorScreenshot = null;
}

return [{
json: {
success: false,
message: "Login failed due to an error.",
error: error.message,
browserVersion: version || "Unknown"
},
binary: errorScreenshot ? {
screenshot: {
data: errorScreenshot,
mimeType: "image/png",
fileName: "error_screenshot.png"
}
} : {}
}];
}
`

However, this always returns the following screenshot:

But when I try the "Get Screenshot" option and just put in the url: "https://account.simplepractice.com/" it returns the screenshot just fine.

I am not sure what environment variables I can add to make this work, or if I need to edit the docker.
Here are the versions in the deploy logs:

Node.js version: v20.18.3

n8n version: 1.81.4

Chromium version: Chromium 133.0.6943.141 Alpine Linux

n8n-nodes-puppeteer version: 1.3.1

Puppeteer core version: 24.3.0

Puppeteer executable path: /usr/bin/chromium-browser

Any help is appreciated!