Utility to render fenced embeds in iframes
npm install @guardian/fenceFence provides a safer way to embed custom code on a website.
Embedding third-party HTML onto a website can endanger the stability
of a page, e.g. by calling destructive web APIs (document.write) or
triggering JavaScript errors. They sometimes expect to be present in
the page on load in order to load scripts synchronously, though you
may want to inject them dynamically.
This library provides a safer abstraction to wrap custom code and
render it on demand.
Fence uses ';
fence.isSafeCode(); // => true
var iframe = '';
fence.isSafeCode(); // => false
`
Once you have a fenced iframe in your page, you can render it by
passing its DOM node or id to the render function:
`javascript
// Render using a reference to the node
var node = document.querySelector('.content iframe.fenced');
fence.render(node);
// ... or just by id, assuming you have:
//
fence.render('some-fenced-iframe');
`
If you just want to render all fenced iframes on the page, you can
simply call:
`javascript`
fence.renderAll();
The easiest way to install fence to use in your web application is
through NPM:
`
$ npm install @guardian/fence
Then simply point your AMD config to the fence.js file and you're
ready to go!
To try the examples locally, simply run:
`
$ npm install
$ grunt connect
Then open http://localhost:9001/examples/ in your browser.
Yes it does. It was developed for and is being used on
the Guardian website.
Fence has been tested on the following browsers:
* Firefox
* Chrome
* IE (9+)