This article relates to webpages that alter the HTML during rendering, and specifically ones that change internal links, with JavaScript.
Crawl with the Chrome Crawler
To identify links and content modified by JavaScript, you will need to set up your audit to crawl with the Chrome Crawler, which executes JavaScript.
When you crawl with the Chrome Crawler, Sitebulb will render the DOM and parse the rendered HTML. It will also go and grab the source HTML (as in, before JavaScript might have changed anything) and compare all the links between the two.
This feature allows Sitebulb to identify all links that have been affected by JavaScript, and surface these via the Response vs Render report.
View link changes in the Response vs Render report
Navigate to the Response vs. Render report and scroll down to the link section. Here, you will see a breakdown of the links created and modified by JavaScript.
Analyse Link Data in bulk
Clicking through any of the chart segments, or the linked numbers in the data table underneath, will show you the link data via the Link Explorer, which includes the column 'JavaScript Status':
The options we have for this column are as follows:
Created - the link was not found in the response HTML, so it appears that JavaScript created it.
Modified - the link was found in the response HTML, however JavaScript has modified either the anchor text or the href URL.
No - not added or altered by JavaScript at all.
View link details for individual URLs
The Link Explorer allows you to interrogate the data en masse. If you want to zone in on particular URLs or particular links, you can also see the data listed on the URL Details page.
Outgoing JS links:
Incoming JS links:
Finding JavaScript links in the Link Report
JavaScript links are also surfaced in the Links report itself, in the data tables below:
Finding JavaScript links in the Single Page Analysis
Independent of any audit, if you want to evaluate a single page, this data is also available in the Single Page Analyser:
JavaScript resources
Learn more about the weird and wonderful world of client-side JavaScript rendering with these expert guides: