How to Hide Cookie Banners in PhantomJS Website Screenshots
Remove or hide a verified cookie banner before PhantomJS captures a page. See runnable code, asynchronous cases, troubleshooting, and a simpler API option.
To hide a cookie banner in a PhantomJS screenshot, wait until the page has loaded, use page.evaluate to find the target site’s verified banner element, then remove it or apply a narrow hiding style before calling page.render. There is no dependable universal selector: inspect each target site and confirm the selector matches only the banner.
This method changes the page’s appearance for that capture. It does not accept consent or establish a stored consent choice.
1. Remove a verified banner before capture
Save this as capture.js and run it with an existing PhantomJS installation. Replace the example URL and selector with the target page and a selector verified in that page’s DOM.
var page = require('webpage').create();
var targetUrl = 'https://example.com/';
var bannerSelector = '#your-verified-banner-selector';
page.open(targetUrl, function (status) {
if (status !== 'success') {
console.log('Unable to access page');
phantom.exit(1);
return;
}
var removed = page.evaluate(function (selector) {
var banner = document.querySelector(selector);
if (!banner || !banner.parentNode) {
return false;
}
banner.parentNode.removeChild(banner);
return true;
}, bannerSelector);
console.log('Banner removed: ' + removed);
page.render('page.png');
phantom.exit();
});
page.evaluate runs the function in the page context. The selector is passed as an argument, so the page function can query the document. A false result means the selector did not match at evaluation time; it does not prove that no banner exists. The banner could use a different selector, be inside a frame, or be inserted later.
PhantomJS documents page automation and rendering in its API reference. Its project homepage says development is suspended, so this guidance is for maintaining an existing PhantomJS workflow; the research here does not establish compatibility with modern sites or evaluate replacement browsers. See the PhantomJS project homepage.
2. Find and verify the right selector
- Open the target page in the same environment and identify the banner’s DOM element using your available browser inspection tools.
- Choose a selector tied specifically to the banner, such as a site-specific ID or class. Avoid broad selectors like
header,aside, or generic dialog classes that could match useful page content. - Check that
document.querySelector(selector)returns the intended banner on every target page in your batch. Different sites, locales, and consent-platform configurations can use different markup. - Run the capture and inspect the output. If the log says
false, or the banner remains visible, confirm the selector and whether the element appears afterpage.opencompletes.
Removing the node can also remove its layout space. If site scripts expect the node to remain present, hide it instead. A narrowly scoped inline style is one option:
var hidden = page.evaluate(function (selector) {
var banner = document.querySelector(selector);
if (!banner) {
return false;
}
banner.style.setProperty('display', 'none', 'important');
return true;
}, bannerSelector);
Hiding may leave a gap if the page layout reserved space outside the banner element. The result depends on the target site’s markup and styles. Inspect the captured image to choose between hiding and removal.
3. Handle banners inserted after page load
Some pages add consent UI asynchronously. In that case, evaluating immediately in the page.open callback may be too early. Wait for a target-specific condition or a deliberate delay, then run the same DOM operation and render. Do not assume one delay works for every site: load time and banner behavior vary.
For example, PhantomJS supports page-side JavaScript evaluation, so a callback can check for the selector repeatedly up to a chosen timeout. This example uses a configurable polling interval and timeout; those values are starting points to adjust for your page, not tested universal timings.
var page = require('webpage').create();
var targetUrl = 'https://example.com/';
var bannerSelector = '#your-verified-banner-selector';
var intervalMs = 250;
var timeoutMs = 5000;
var elapsedMs = 0;
page.open(targetUrl, function (status) {
if (status !== 'success') {
console.log('Unable to access page');
phantom.exit(1);
return;
}
var timer = setInterval(function () {
var result = page.evaluate(function (selector) {
var banner = document.querySelector(selector);
if (!banner) {
return { found: false, removed: false };
}
if (banner.parentNode) {
banner.parentNode.removeChild(banner);
}
return { found: true, removed: true };
}, bannerSelector);
if (result.found) {
clearInterval(timer);
console.log('Banner removed: ' + result.removed);
page.render('page.png');
phantom.exit();
return;
}
elapsedMs += intervalMs;
if (elapsedMs >= timeoutMs) {
clearInterval(timer);
console.log('Banner not found before timeout; capturing page as-is');
page.render('page.png');
phantom.exit();
}
}, intervalMs);
});
This polling example captures the page as-is if the selector never appears. Change that policy if an unmodified capture would be misleading for your workflow. A missing selector can also mean the page has no banner, uses different markup, or places the UI in a frame; investigate before treating it as a successful removal.
4. DOM appearance is separate from cookie state
Removing or hiding an element affects what is painted in this document. It does not record that a visitor accepted cookies. PhantomJS has separate cookie APIs for browser state; changing cookies is not a guaranteed way to remove an already-rendered banner. Use DOM manipulation when the goal is a clean screenshot. Use cookie handling only when you specifically need to test behavior with a particular browser cookie state.
A screenshot alone does not establish that consent was given. These instructions describe a visual capture technique and make no legal-compliance claim.
5. Troubleshooting
| Symptom | Likely cause | What to do |
|---|---|---|
| The banner is still visible | The selector is wrong, the element appeared after evaluation, or the banner is in a frame. | Verify the selector against the rendered DOM. Wait for the element if it is asynchronous. If it is in a frame, inspect that frame and handle its document separately. |
The script reports Banner removed: false |
No element matched at the time of the query. | Check the selector spelling and timing. Confirm that the banner exists on this URL and is not rendered in a frame or another browsing context. |
| The page layout has an empty space after hiding | The banner’s space may be reserved by a parent or surrounding layout. | Try removing the specific banner node instead, or identify the exact element responsible for the reserved space. Keep selectors narrow. |
| The page breaks after node removal | Site scripts may expect the banner node to remain available. | Use a scoped display: none style instead and check whether the layout remains acceptable. |
| The output file includes the banner despite a successful log | Rendering may happen before the change is reflected, or the selector may match a wrapper rather than the visible banner. | Keep page.render after the evaluation callback, verify the matched element, and inspect the output. |
| The page fails to open | page.open returned a status other than success. |
Check that the URL is reachable from the capture environment and log the status. The example exits with an error instead of silently reporting a successful capture. |
6. Performance, reliability, and maintenance
- Keep the selector narrow. A generic selector can remove unrelated content, while a site-specific selector needs maintenance when the site changes its markup.
- Wait only as needed. Immediate evaluation avoids extra waiting when the banner is already present. Polling or a delay adds capture time; use a condition that reflects the target site where possible.
- Choose an explicit missing-banner policy. For batch jobs, decide whether to capture as-is, mark the result for review, or fail the job if the banner is expected but absent.
- Review output samples after site changes. A script can still exit normally even when the selector stops matching. Log the match result and inspect representative screenshots.
- Account for PhantomJS’s maintenance status. The official project homepage says development is suspended. Treat this as legacy-workflow guidance, and assess your own compatibility and maintenance needs before depending on it for new production work.
Or skip the browser setup
If you only need a screenshot, ScreenshotNeo is a website screenshot API and MCP server. Its API accepts one GET request with a URL and can return PNG, JPEG, WebP, or PDF. See the ScreenshotNeo API documentation.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com -o shot.webp
import requests
r = requests.get(
"https://api.screenshotneo.com/v1/shot",
params={"access_key": "YOUR_API_KEY", "url": "https://example.com"},
timeout=90,
)
open("shot.webp", "wb").write(r.content)
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://example.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
- Cookie and consent banners, newsletter popups, and chat widgets are removed before the shot; each cleanup step can be turned off.
- Bot checks, blank pages, timeouts, failed loads, and cache hits cost nothing. Responses identify the page verdict and billing status in headers.
- An MCP server lets AI agents, including Claude and Cursor, take screenshots with tools such as
take_screenshot,get_page_info, andcapture_pdf. - The Free plan includes 1,000 screenshots per month with no card. Paid plans start at $5 for 3,000 shots; every feature is on every plan.
Sign up for ScreenshotNeo to get 1,000 free screenshots a month with no card.
FAQ
Can one PhantomJS selector work for every website?
No. Verify a selector for each target site and check it again when that site changes its banner markup.
Should I delete the banner or hide it?
Delete the specific node if removing its layout space is appropriate. Hide it with a scoped style if page scripts may need the node to remain. Inspect the resulting layout either way.
Does removing the banner accept cookies?
No. It changes the rendered DOM for the capture; it does not itself record a consent choice.
Is PhantomJS suitable for a new screenshot pipeline?
Its official homepage says development is suspended. This article covers a way to maintain an existing workflow; it does not assess modern-site compatibility or recommend a replacement browser.


