How to Test Whether a JavaScript Website Is Rendering SEO Content
A JavaScript-heavy page can look complete in a browser while presenting search engines with little more than an empty container. That difference matters when important copy, product details, internal links or metadata only appear after scripts run.
Testing does not require guessing how a search engine sees your site. You can compare the original HTML with the rendered page, inspect the result in Google Search Console and check whether the important information is available without fragile interactions. This guide explains how to do that, how to interpret what you find and when a rendering issue is likely to affect organic search.
What does JavaScript rendering mean for SEO?
A browser first receives HTML from the server. JavaScript may then run in the browser to add or change page content. The HTML sent initially is often called the raw or source HTML; the page after scripts have run is the rendered HTML or rendered DOM. The DOM is the browser’s structured representation of the page.
For example, an ecommerce server might return a page shell containing a header and an empty <div id="product">. A script then fetches the product name, description, price and links to related products. A person with a working browser sees the finished page. The SEO question is whether a search engine can retrieve and render the necessary information reliably.
Google documents that it processes JavaScript pages through crawling and rendering, but rendering can happen separately from the initial crawl. Its JavaScript SEO guidance recommends checking the rendered output and warns that not all crawlers execute JavaScript in the same way. This is why a page that works in one browser is not, by itself, proof that its content is available to search engines.
Start by choosing representative pages
Do not begin by testing one homepage and assuming the entire site behaves the same way. Rendering often differs between templates or states. Choose a small, deliberate sample:
- A key landing page that brings in organic visits.
- A typical product, service or article page.
- A page with content loaded after a user action, such as a tab or “load more” button.
- A page that has recently lost visibility or has been redesigned.
Include examples from different templates, not just different URLs. If a business has hundreds of service-area pages generated from one template, testing a few of those pages can reveal a shared implementation problem. Record the URL, template, expected main content and the date you tested it.
How to test JavaScript rendering for SEO
1. Compare the source HTML with the rendered page
Open the page in a browser and use “View page source” to inspect the original response. Search for a distinctive sentence, product name or heading that should be visible on the page. If it is absent, the server probably did not send that content in the initial HTML.
Then inspect the rendered page using browser developer tools. In Chrome, open DevTools, select the Elements panel and search for the same text. You can also use the Console to check for JavaScript errors. If the text is missing in source but present in the rendered DOM, it is being added by JavaScript. That is not automatically a problem; it means you should verify that the scripts, data requests and resulting content are accessible to crawlers.
For a quick command-line comparison, request the page with curl:
curl -L https://example.com/services/plumbing/
This retrieves the server response; it does not run the page’s JavaScript. It is useful for checking whether content is server-rendered, but it cannot tell you what the finished DOM looks like. Do not treat the output from curl as a complete rendering test.
2. Check Google’s rendered result in Search Console
In Google Search Console, use URL Inspection for a specific page. The live test can show whether Google can access the URL and provide a rendered screenshot and HTML, subject to the tool’s available output. Inspect both the screenshot and the HTML. Search for the page’s main heading, core copy and important links; a screenshot can look plausible while important details are absent from the document.
Google’s URL Inspection tool documentation explains how to inspect a URL and run a live test. A live test is a diagnostic snapshot, not a guarantee that the URL is indexed or that every future crawl will produce the same result. Compare it with the indexed version where relevant, and retest after changes have been deployed.
Check the reported access and indexing information as well as the rendered content. A blocked resource, server error or unintended noindex directive can matter more than the JavaScript framework itself. If the live test fails to fetch a required script or data endpoint, identify why before changing how the page is rendered.
3. Verify the SEO elements that matter
Make a checklist for each sampled page. Look for the following in the rendered HTML:
- Main content: Does the primary heading and useful page copy appear, not just navigation and a loading message?
- Title and description: Are the title element and meta description present and appropriate to the page?
- Canonical and robots directives: Is the canonical URL correct? Is the page accidentally marked noindex?
- Links: Are links to important destinations standard, crawlable links with an
hrefattribute? - Structured data: If used, does the rendered page contain valid data that matches visible content?
- Images and labels: Are meaningful image alternatives and descriptive labels present where needed?
Pay particular attention to internal links. A button with a click handler may take a visitor to another page but does not necessarily provide the same crawlable link as an anchor such as <a href="/services/drain-repair/">. Also check whether links or text appear only after scrolling, accepting a prompt or clicking a tab. Test the page in its normal initial state and note any interaction needed to reveal essential information.
4. Check whether scripts and data can be fetched
When content is missing, open the browser Network panel and reload the page. Look for failed JavaScript files and API or data requests, especially requests returning 403, 404 or 5xx responses. Check whether a required resource is blocked by robots.txt, requires a login, depends on a cookie or fails intermittently.
Consider the timing and dependency chain. A page might need several scripts to load before it requests product data, then another script to insert the response into the page. A slow or failing step can leave a crawler with a loading state. A single successful local test does not rule out an intermittent problem, so repeat tests and compare URLs served from the same template.
5. Test mobile and interaction-dependent content
Check the responsive version, not just the desktop layout. The same page may use different scripts or loading rules on mobile. Confirm that the main content is available without relying on hover, a complex click sequence or a user-specific session. If content is revealed by a tab or accordion, inspect whether it exists in the rendered DOM before interaction and whether the interface is usable with a keyboard.
Lazy loading can also affect what appears. Scroll through the page in a browser, then inspect whether more content is added. If important copy or links load only after scrolling, test how the page behaves in Google’s inspection tool. Avoid assuming that every crawler will scroll or interact exactly as a person would.
How to interpret common test results
Content is in both source and rendered HTML
This is usually the simplest setup to diagnose: the server supplies the content, and JavaScript enhances the page. Still check status codes, indexability, canonical tags and link destinations. Server-rendered content does not compensate for a noindex directive or a broken canonical.
Content is missing from source but present after rendering
This is a client-rendered page. It may be discoverable to Google, but the implementation depends on scripts and any data they need. Check Search Console’s rendered result, resource access and the consistency of the output. For high-value pages, discuss server-side rendering or static generation with developers if rendering failures, delayed content or crawler compatibility remain a risk.
Content is missing from both
First establish whether the page itself is working for a visitor. Check the URL, server response, app state and data source. If users also see a blank page, this is primarily an application or availability issue. If users see content but Google’s live test does not, compare the two environments and look for blocked resources, bot restrictions, required interactions or errors.
The screenshot looks right, but the HTML is incomplete
Do not rely on the screenshot alone. Check whether the important text, links, metadata and structured data are actually in the rendered document. A visual element might be painted onto a canvas, represented only in an image, or inserted in a way that does not expose the information as expected. For essential page content, ordinary HTML text and links are generally easier to inspect and more robust.
A practical debugging workflow for a business site
Imagine a small retailer notices that a new range of product pages is not appearing for relevant searches. The pages look fine to staff, but the HTML source contains only a product-page shell. A useful investigation would proceed like this:
- Compare affected and unaffected URLs. Test one new product page and one older page using the same template. Note whether their source and rendered output differ.
- Inspect Google’s live test. Check whether the product name, description, price and links to related products appear in the rendered HTML and screenshot.
- Review failed requests. If the product API returns an error or requires a session cookie, confirm whether that is expected and whether the page can render without it.
- Check indexability separately. Verify the response status, robots directives and canonical. Rendering and indexing are related, but they are not the same diagnosis.
- Fix the cause and retest the template. If the issue comes from a blocked data request, fix access. If important content depends on fragile client-side execution, consider making it available in the initial response.
- Monitor a small set of URLs. After deployment, inspect representative pages again and watch Search Console for changes in crawling, indexing and organic performance.
If many URLs are affected, look for a template-level or deployment change rather than inspecting every page individually. When the symptom is a broader crawl change, a separate crawl investigation may help; see our guide to diagnosing a sudden drop in Googlebot crawling. Keep rendering checks distinct from crawl-rate analysis so the evidence points to the right cause.
When should you consider changing the rendering approach?
Rendering every page on the server can add development and infrastructure work, so it is not an automatic fix. A change is more worth discussing when key content regularly fails to appear in crawler tests, pages depend on interaction to reveal their main purpose, or rendering introduces delays and instability. The right option depends on the framework, hosting setup, update frequency and engineering capacity.
Server-side rendering sends a populated HTML response for each request; static generation creates HTML ahead of time for pages that can be built in advance. Both can make core content available earlier, but they still need testing. Check that the delivered HTML matches the visible page, that URLs return appropriate status codes, and that changes to product or editorial data are reflected promptly.
Measure the outcome against the original problem. For example, track whether the important content appears in inspection tests, whether affected URLs are crawled and indexed, and whether relevant organic impressions or visits change over time. Do not attribute a traffic movement to rendering alone without considering other changes, such as demand, internal linking, page quality or technical releases.
FAQ
Does Google index JavaScript-generated content?
Google can render and process JavaScript, but the result depends on whether the page and its required resources are accessible and execute successfully. Test the specific URLs rather than assuming every implementation will be handled identically.
Is “View Source” enough to test JavaScript SEO?
No. View Source shows the initial HTML response, not the finished page after JavaScript runs. Compare it with the rendered DOM and use Search Console’s URL Inspection live test to examine Google’s view.
Should every SEO page use server-side rendering?
No. It can be useful when important content is unreliable or unavailable to crawlers, but it involves engineering trade-offs. A well-tested client-rendered page may work; choose an approach based on evidence from your templates and crawler tests.
How often should I test rendering?
Test when launching or changing a template, after significant JavaScript or routing changes, and when organic visibility or indexing issues suggest a rendering problem. For large sites, maintain a representative sample of important URLs rather than manually checking every page after every release.
Does a successful live test mean the page is indexed?
No. A live test checks whether Google can access and render the URL at that time. Indexing is a separate decision, and a successful test does not guarantee inclusion in search results.