Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

fetch-vcr

Package Overview
Dependencies
Maintainers
1
Versions
30
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

fetch-vcr - npm Package Compare versions

Comparing version 1.0.0 to 1.0.1

2

package.json
{
"version": "1.0.0",
"version": "1.0.1",
"name": "fetch-vcr",

@@ -4,0 +4,0 @@ "description": "Stop mocking HTTP Requests. Just record and then play them back",

@@ -14,5 +14,5 @@ # fetch-vcr

The basics are:
After setting up (see below), the basics are:
1. turn on `cache` mode
1. set the `VCR_MODE=cache` environment variable before running your tests
2. run your tests

@@ -22,33 +22,10 @@

And when you run the steps again, no network traffic happens.
And when you run the steps again, viola! no network traffic happens.
# How do I set this up?
```js
// import fetch from 'fetch';
import fetch from 'fetch-vcr';
// Configure what mode this VCR is in (playback, recording, cache)
// and where the recordings should be loaded/saved to.
fetch.configure({
mode: 'record',
fixturePath: __dirname + '/_fixtures'
})
fetch('http://openstax.org')
.then(response => {
response.text()
.then(text => {
console.log(text)
})
})
```
# What are the different modes?
- `playback`: (default) **only** uses the local fixture files
- `cache`: tries to use the fixture and if not found then it is fetched and then saved (useful when adding new tests)
- `record`: forces files to be written (useful for regenerating all the fixtures)
- `erase`: deletes the fixture corresponding to the request
- `cache`: tries to use the recorded response and if not found then it is fetched and then saved (useful when adding new tests)
- `record`: forces HTTP requests and responses are saved to the filesystem (useful for regenerating all the fixtures)

@@ -60,22 +37,48 @@

- setting the `VCR_MODE=record` environment variable
- explicitly running `fetch.configure({mode: 'record'})`
- setting the `VCR_MODE=record` environment variable when running tests (NodeJS)
- explicitly running `fetch.configure({mode: 'record'})` (NodeJS or browser)
# How can I use this in a browser?
# How do I set this up?
Currently you can record HTTP requests in NodeJS and play them back in the browser.
There are separate examples for NodeJS, Jest, and in a browser (PhantomJS or Selenium)
To play them back in a browser, just run `fetchVCR.configure({fixturePath: './path/to/_fixtures'})` and `fetchVCR` will use that path to load the files via AJAX requests.
## NodeJS Setup
To record HTTP requests in a browser you will need to do a little bit of work. Loading fixture files is relatively painless (using `XMLHTTPRequest`) but saving them to disk is non-trivial.
Here is how you would use it in a typical NodeJS app:
In order to save the fixture files to disk you will need to override `fetchVCR.saveFile(rootPath, filename, contents) => Promise`.
```js
// import fetch from 'fetch';
import fetch from 'fetch-vcr';
If you are using PhantomJS then you will likely need to use the `alert(msg)` to get data out of PhantomJS and then save it to the filesystem (using `fs.writeFile(...)`)
// Configure where the recordings should be loaded/saved to.
// The path is relative to `process.cwd()` but can be absolute.
fetch.configure({
fixturePath: './_fixtures',
// mode: 'record' <-- This is optional
})
## Using jsdom (like Jest)
// Use fetch like you would normally
fetch('http://openstax.org')
.then(response => {
console.log(response.ok)
})
```
Jest runs using jsdom which makes it really easy to add fetchVCR. Basically, just replace the global `fetch` function with `fetchVCR` and you can record/play back the cassettes. See below for an example:
## Jest Setup
Just add the following to `package.json`:
```
"jest": {
"moduleNameMapper": {
"fetch": "fetch-vcr"
}
}
```
## jsdom Setup
Many apps use `jsdom` for testing which makes it really easy to add `fetch-vcr`. Just replace the global `fetch` function with `fetchVCR` and you can record/play back the cassettes. See below for an example:
```js

@@ -85,13 +88,12 @@ var fs = require('fs')

var fetchVCR = require('fetch-vcr')
var JSDOM = jsdom.JSDOM
// Configure the fetchVCR to record
// Configure the path to find cassettes
fetchVCR.configure({
fixturePath: './_fixtures/',
mode: 'cache'
fixturePath: './_fixtures/'
})
var dom = new JSDOM(fs.readFileSync('./jsdom-example.html'), {
var dom = new jsdom.JSDOM(fs.readFileSync('./jsdom-example.html'), {
runScripts: 'dangerously',
beforeParse: (window) => {
// This changes the fetch global to be fetchVCR
window.fetch = fetchVCR

@@ -103,3 +105,16 @@ }

## How can I use this in a browser?
It is easy to record HTTP requests in NodeJS and play them back in the browser.
To play them back in a browser, just run `fetchVCR.configure({fixturePath: './path/to/_fixtures'})` and `fetchVCR` will use that path to load the files via AJAX requests.
To record HTTP requests in a browser you will need to do a little bit of work. Loading fixture files is relatively painless (using `XMLHTTPRequest`) but saving them to disk is non-trivial.
In order to save the fixture files to disk you will need to override `fetchVCR.saveFile(rootPath, filename, contents) => Promise`.
If you are using PhantomJS you will likely need to use the `alert(msg)` to get data out of PhantomJS and then save it to the filesystem (using `fs.writeFile(...)`)
[kanban-image]: https://img.shields.io/github/issues/philschatz/fetch-vcr.svg?label=kanban%20board%20%28gh-board%29

@@ -106,0 +121,0 @@ [kanban-url]: http://philschatz.com/gh-board/#/r/philschatz:fetch-vcr

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc