ember-responsive - npm Package Compare versions

Comparing version 1.2.5 to 1.2.6

addon/media.js

@@ -5,2 +5,4 @@ import Ember from 'ember';
 
+const { dasherize, classify } = Ember.String;
+
 /**
@@ -112,3 +114,3 @@ * Handles detecting and responding to media queries.
    */
-  init: function() {
+  init() {
     const owner = getOwner(this);
@@ -138,5 +140,4 @@ owner.registerOptionsForType('breakpoints', { instantiate: false });
   classNames: Ember.computed('matches.[]', function() {
-    var dasherize = Ember.String.dasherize;
     return this.get('matches').map(function(name) {
-      return 'media-' + dasherize(name);
+      return `media-${dasherize(name)}`;
     }).join(' ');
@@ -166,18 +167,16 @@ }),
   */
-  match: function(name, query) {
-    var classify = Ember.String.classify,
-        matcher = (this.get('mql') || window.matchMedia)(query),
-        isser = 'is' + classify(name),
-        _this = this;
+  match(name, query) {
+    var matcher = (this.get('mql') || window.matchMedia)(query),
+        isser = 'is' + classify(name);
 
-    function listener(matcher) {
-      _this.set(name, matcher);
-      _this.set(isser, matcher.matches);
+    var listener = (matcher) => {
+      this.set(name, matcher);
+      this.set(isser, matcher.matches);
 
       if (matcher.matches) {
-        _this.get('matches').addObject(name);
+        this.get('matches').addObject(name);
       } else {
-        _this.get('matches').removeObject(name);
+        this.get('matches').removeObject(name);
       }
-    }
+    };
     this.get('listeners')[name] = listener;
@@ -184,0 +183,0 @@

CHANGELOG.md

 # Changelog
 
+### 1.2.6
+
+- New test helpers (#65 @blimmer)
+- ES6 syntax (#63 @blimmer)
+
 ### 1.2.4
@@ -4,0 +9,0 @@ - Support fastboot (#56 @tomdale)

package.json

 {
   "name": "ember-responsive",
-  "version": "1.2.5",
+  "version": "1.2.6",
   "description": "An ember-cli addon that give you a simple, Ember-aware way of dealing with media queries.",
@@ -22,3 +22,3 @@ "directories": {
     "broccoli-asset-rev": "^2.2.0",
-    "ember-cli": "1.13.13",
+    "ember-cli": "1.13.15",
     "ember-cli-app-version": "^1.0.0",
@@ -25,0 +25,0 @@ "ember-cli-content-security-policy": "0.4.0",

README.md

@@ -25,3 +25,3 @@ # ember-responsive [![Build Status](https://travis-ci.org/freshbooks/ember-responsive.svg?branch=master)](https://travis-ci.org/freshbooks/ember-responsive) [![Ember Observer Score](http://emberobserver.com/badges/ember-responsive.svg)](http://emberobserver.com/addons/ember-responsive)
 
-```
+```js
 export default {
@@ -41,3 +41,3 @@ mobile:  '(max-width: 768px)',
 
-```
+```js
 this.get('media.isMobile'); // => true
@@ -48,3 +48,3 @@ ```
 
-```
+```hbs
 {{#if media.isDesktop}}
@@ -59,3 +59,3 @@ Desktop view!
 
-```
+```js
 App.ApplicationView = Ember.View.extend({
@@ -66,2 +66,50 @@ classNameBindings: ['media.classNames']
 
+## Testing Helpers
+This project provides several testing helpers to assist in testing
+content specific to different breakpoints.
+
+### Acceptance Tests
+This project provides an acceptance testing helper to assist in testing
+content specific to different breakpoints.
+
+To use the `setBreakpoint` helper in an acceptance test:
+
+```javascript
+test('example test', function(assert) {
+  setBreakpoint('mobile');
+  visit('/');
+
+  andThen(function() {
+    // assert something specific to mobile
+  });
+});
+```
+
+The default breakpoint for testing defaults to `desktop`. You can modify this
+by changing `_defaultBreakpoint` in `tests/helpers/responsive.js`.
+
+### Integration Tests
+Since the entire application isn't spun up for an integration tests, the `setBreakpoint`
+acceptance test helper won't work. In this case, you'll need to use the
+`setBreakpointForIntegrationTest` helper.
+
+To use the `setBreakpointForIntegrationTest` helper in an integration test:
+
+```javascript
+import { moduleForComponent, test } from 'ember-qunit';
+import hbs from 'htmlbars-inline-precompile';
+import { setBreakpointForIntegrationTest } from 'your-app-name/tests/helpers/responsive';
+
+moduleForComponent('foo-bar', 'Integration | Component | foo bar', {
+  integration: true
+});
+
+test('it renders', function(assert) {
+  setBreakpointForIntegrationTest(this, 'mobile');
+  this.render(hbs`{{foo-bar media=media}}`); // IMPORTANT: you must pass the media service
+
+  // assert something specific to mobile
+});
+```
+
 ## Tests
@@ -71,3 +119,3 @@
 
-```
+```sh
 npm install
@@ -74,0 +122,0 @@ bower install

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

19524

increased by24.31%

Number of package files

20

increased by17.65%

Lines of code

341

increased by22.66%

Number of lines in readme file

124

increased by63.16%

No dependency changes