@@ -20,6 +20,8 @@ module.exports = function(config) {
 'bower_components/jquery-1/index.js',
 'bower_components/jquery/dist/jquery.js',
 'node_modules/es6-promise/dist/es6-promise.auto.js',
+'node_modules/abortcontroller-polyfill/dist/abortcontroller-polyfill-only.js',
+'node_modules/yetch/dist/yetch-ponyfill.js',
 'pretender.js',
 'test/**/*.js'
 ],

@@ -37,8 +37,10 @@
 "sinon": "^3.2.1"
 },
 "dependencies": {
+"abortcontroller-polyfill": "^1.1.9",
 "fake-xml-http-request": "^2.0.0",
-"route-recognizer": "^0.3.3"
+"route-recognizer": "^0.3.3",
+"yetch": "^0.0.1"
 },
 "jspm": {
 "shim": {

@@ -13,6 +13,9 @@ var RouteRecognizer = appearsBrowserified ? getModuleDefault(require('route-reco
 var FakeXMLHttpRequest = appearsBrowserified ? getModuleDefault(require('fake-xml-http-request')) :
 self.FakeXMLHttpRequest;
 
+// fetch related ponyfills
+var Yetch = appearsBrowserified ? getModuleDefault(require('yetch/dist/yetch-polyfill')) : self.Yetch;
+
 /**
 * parseURL - decompose a URL into its parts
 * @param {String} url a URL
@@ -139,6 +142,14 @@ function Pretender(/* routeMap1, routeMap2, ..., options*/) {
 // the route map.
 self.XMLHttpRequest = interceptor(ctx);
 
+// polyfill fetch when xhr is ready
+// AbortController doesn't need restore
+this._fetchProps = ['fetch', 'Headers', 'Request', 'Response'];
+this._fetchProps.forEach(function(name) {
+this['_native' + name] = self[name];
+self[name] = Yetch[name];
+}, this);
+
 // 'start' the server
 this.running = true;
 
@@ -471,6 +482,9 @@ Pretender. = {
 },
 shutdown: function shutdown() {
 self.XMLHttpRequest = this._nativeXMLHttpRequest;
+this._fetchProps.forEach(function(name) {
+self[name] = this['_native' + name];
+}, this);
 this.ctx.pretender = undefined;
 // 'stop' the server
 this.running = false;

@@ -0,0 +1,102 @@
+var describe = QUnit.module;
+var it = QUnit.test;
+var clock;
+
+describe('pretender invoking by fetch', function(config) {
+config.beforeEach(function() {
+this.pretender = new Pretender();
+});
+
+config.afterEach(function() {
+if (clock) {
+clock.restore();
+}
+this.pretender.shutdown();
+});
+
+it('fetch triggers pretender', function(assert) {
+var wasCalled;
+
+this.pretender.get('/some/path', function() {
+wasCalled = true;
+});
+
+fetch('/some/path');
+assert.ok(wasCalled);
+});
+
+it('is resolved asynchronously', function(assert) {
+assert.expect(2);
+var done = assert.async();
+var val = 'unset';
+
+this.pretender.get('/some/path', function(request) {
+return [200, {}, ''];
+});
+
+fetch('/some/path').then(function() {
+assert.equal(val, 'set');
+done();
+});
+
+assert.equal(val, 'unset');
+val = 'set';
+});
+
+it('can NOT be resolved synchronously', function(assert) {
+assert.expect(1);
+var val = 0;
+
+this.pretender.get(
+'/some/path',
+function(request) {
+return [200, {}, ''];
+},
+false
+);
+
+fetch('/some/path').then(function() {
+// This won't be called
+assert.equal(val, 0);
+val++;
+});
+assert.equal(val, 0);
+});
+
+it('has NO Abortable fetch', function(assert) {
+assert.expect(1);
+var done = assert.async();
+var wasCalled = false;
+this.pretender.get(
+'/downloads',
+function(request) {
+return [200, {}, 'FAIL'];
+},
+200
+);
+
+var controller = new AbortController();
+var signal = controller.signal;
+setTimeout(function() {
+controller.abort();
+}, 10);
+fetch('/downloads', { signal: signal })
+.then(function(data) {
+assert.ok(data, 'AbortError was not rejected');
+done();
+})
+.catch(function(err) {
+// it should execute to here but won't due to FakeXmlHttpRequest limitation
+//
+// ### why it's not working for fetch
+// For `fake_xml_http_request` impl, the request is resolved once its state
+// is changed to `DONE` so the `reject` is not cathed.
+// So the senario happens in pretender is:
+// 1. state chagne to `DONE`, trigger resolve request
+// 2. abort, trigger reject
+// 3. xhr.onerror, trigger reject
+// The first resolve wins, error thus not rejected but an empty request is resolved.
+done();
+});
+});
+});