A connector is the interface between a .hintrc's configured hints and the website you are testing. It is responsible for loading and rendering that site, then exposing collected information to webhint such as resources, network data, etc.
To use a connector, first install its package. The package name should
start with @hint/connector-
, webhint-connector-
, or
@scope/webhint-connector-
. Then, add the package name to the
connector
object within your .hintrc file. Packages within the
@hint/
namespace (like, for example, @hint/connector-local
) can be
added using their short name.
{
"connector": {
"name": "local"
}
}
Otherwise, use the full package name. If you were to use the
hypothetical connector @orgName/webhint-connector-super-duper
, your
connector
object would look like this:
{
"connector": {
"name": "@orgName/webhint-connector-super-duper"
}
}
All of the built-in connectors run in any of webhint's supported platforms: Linux, macOS, and Windows. The only caveat is that you need to already have the browser or other binary utilized by that connector installed; webhint cannot install it for you.
The officially supported connectors which can be installed using your preferred package manager are:
@hint/connector-jsdom
. Uses jsdom.@hint/connector-local
. Analyzes the local files in your project.@hint/connector-puppeteer
. Uses puppeteer to communicate with locally installed browsers.
Note that @hint/connector-chrome
has been
deprecated in favor of the puppeteer connector.
Connectors can be configured. Maybe you want to make a request with
another userAgent, change some of the other defaults, etc. To customize
the behavior of your selected connector, add the property options
to
your connector
object with the values you want to modify:
{
"connector": {
"name": "jsdom",
"options": {
"ignoreHTTPSError": false
}
}
}
Check out the documentation for each official connector for more information about the options available.
If you want to implement your own connector, visit the contributor guide.