Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to test String.prototype.includes in PhantomJS

I have an ember-cli 0.2.7 using Ember.js 1.12.0 app with a piece of code that looks like:

controllers/cart.js

import Ember from 'ember';

export default Ember.Controller.extend({

    footwearInCart: Ember.computed('[email protected]', function() {
        return this.get('model').any(product => product.get('category').includes('Footwear'));
    })
});

It goes through all the objects in the model and returns true if their category property has 'footwear' in it.

I'm trying to test it like so:

tests/unit/controllers/cart-test.js

import { moduleFor, test } from 'ember-qunit';
import Ember from 'ember';

var products = [Ember.Object.create({name: 'shoe', category: 'Footwear', subTotal: 10}), Ember.Object.create({name: 'shirt', subTotal: 20})];

var model = Ember.ArrayProxy.create({
  content: Ember.A(products)
});

moduleFor('controller:cart', {
  beforeEach() {
    this.controller = this.subject();
  }
});

test('footwearInCart property works', function(assert) {
  this.controller.set('model', model);

  assert.equal(this.controller.get('footwearInCart'), true, 'The footwearInCart function returns true if the category property of product in cart contains the word "Footwear"');
});

The code works the way it should when I run the app, but PhantomJS apparently does not recognise the .includes method. (The method is documented here String.prototype.includes()

How can I get PhantomJS to recognize the .includes method?

Thanks!

like image 262
zshnr Avatar asked Jul 11 '15 18:07

zshnr


2 Answers

Apparently PhantomJS doesn't implement ES6 features properly. Luckily String.prototype.includes is quite easy to polyfill. You can choose if you want to do that in the test suite or the controller. The polyfill code is:

if (!String.prototype.includes) {
  String.prototype.includes = function() {'use strict';
    return String.prototype.indexOf.apply(this, arguments) !== -1;
  };
}

Either put it right before the assert call (you might want to use a flag to remember of you added the polyfill and remove it after the assert), or do it in the module itself, before or after the export block.

like image 195
Amit Avatar answered Sep 20 '22 20:09

Amit


While the selected answer is correct, I think it's worth noting that adding this into the specific test is not good enough for most apps; I'd suggest creating a vendor/phantom-js-polyfills.js that contains this polyfill (plus any others that come up down the line) and then inside your ember-cli-build.js you can conditionally load it in:

  if (EmberApp.env() === 'test') {
    app.import('vendor/phantom-js-polyfills.js');
  }
like image 34
gcoladarci Avatar answered Sep 19 '22 20:09

gcoladarci