ember-container-query 1.1.9 → 2.0.0-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -26,25 +26,11 @@ jobs:
26
26
  - name: Use Node.js ${{ env.NODE_VERSION }}
27
27
  uses: actions/setup-node@v2
28
28
  with:
29
+ cache: 'yarn'
29
30
  node-version: ${{ env.NODE_VERSION }}
30
31
 
31
- - name: Get Yarn cache path
32
- id: yarn-cache-dir-path
33
- run: echo "::set-output name=dir::$(yarn cache dir)"
34
-
35
- - name: Cache Yarn cache and node_modules
36
- id: cache-dependencies
37
- uses: actions/cache@v2
38
- with:
39
- path: |
40
- ${{ steps.yarn-cache-dir-path.outputs.dir }}
41
- node_modules
42
- key: ${{ runner.os }}-${{ env.NODE_VERSION }}-${{ hashFiles('**/yarn.lock') }}
43
- restore-keys: ${{ runner.os }}-${{ env.NODE_VERSION }}-
44
-
45
32
  - name: Install dependencies
46
33
  run: yarn install --frozen-lockfile
47
- if: steps.cache-dependencies.outputs.cache-hit != 'true'
48
34
 
49
35
  - name: Build app
50
36
  run: yarn build:test
@@ -67,25 +53,11 @@ jobs:
67
53
  - name: Use Node.js ${{ env.NODE_VERSION }}
68
54
  uses: actions/setup-node@v2
69
55
  with:
56
+ cache: 'yarn'
70
57
  node-version: ${{ env.NODE_VERSION }}
71
58
 
72
- - name: Get Yarn cache path
73
- id: yarn-cache-dir-path
74
- run: echo "::set-output name=dir::$(yarn cache dir)"
75
-
76
- - name: Cache Yarn cache and node_modules
77
- id: cache-dependencies
78
- uses: actions/cache@v2
79
- with:
80
- path: |
81
- ${{ steps.yarn-cache-dir-path.outputs.dir }}
82
- node_modules
83
- key: ${{ runner.os }}-${{ env.NODE_VERSION }}-${{ hashFiles('**/yarn.lock') }}
84
- restore-keys: ${{ runner.os }}-${{ env.NODE_VERSION }}-
85
-
86
59
  - name: Install dependencies
87
60
  run: yarn install --frozen-lockfile
88
- if: steps.cache-dependencies.outputs.cache-hit != 'true'
89
61
 
90
62
  - name: Lint
91
63
  run: yarn lint
@@ -96,15 +68,37 @@ jobs:
96
68
  needs: [build-app]
97
69
  runs-on: ubuntu-latest
98
70
  strategy:
71
+ fail-fast: false
99
72
  matrix:
100
- width:
101
- - 'w1'
102
- - 'w2'
103
- - 'w3'
104
- height:
105
- - 'h1'
106
- - 'h2'
107
- - 'h3'
73
+ device:
74
+ - 'w1-h1'
75
+ - 'w2-h1'
76
+ - 'w3-h1'
77
+ - 'w1-h2'
78
+ - 'w2-h2'
79
+ - 'w3-h2'
80
+ - 'w1-h3'
81
+ - 'w2-h3'
82
+ - 'w3-h3'
83
+ include:
84
+ - device: 'w1-h1'
85
+ test-port: 7357
86
+ - device: 'w2-h1'
87
+ test-port: 7358
88
+ - device: 'w3-h1'
89
+ test-port: 7359
90
+ - device: 'w1-h2'
91
+ test-port: 7360
92
+ - device: 'w2-h2'
93
+ test-port: 7361
94
+ - device: 'w3-h2'
95
+ test-port: 7362
96
+ - device: 'w1-h3'
97
+ test-port: 7363
98
+ - device: 'w2-h3'
99
+ test-port: 7364
100
+ - device: 'w3-h3'
101
+ test-port: 7365
108
102
  timeout-minutes: 5
109
103
  steps:
110
104
  - name: Check out a copy of the repo
@@ -113,25 +107,11 @@ jobs:
113
107
  - name: Use Node.js ${{ env.NODE_VERSION }}
114
108
  uses: actions/setup-node@v2
115
109
  with:
110
+ cache: 'yarn'
116
111
  node-version: ${{ env.NODE_VERSION }}
117
112
 
118
- - name: Get Yarn cache path
119
- id: yarn-cache-dir-path
120
- run: echo "::set-output name=dir::$(yarn cache dir)"
121
-
122
- - name: Cache Yarn cache and node_modules
123
- id: cache-dependencies
124
- uses: actions/cache@v2
125
- with:
126
- path: |
127
- ${{ steps.yarn-cache-dir-path.outputs.dir }}
128
- node_modules
129
- key: ${{ runner.os }}-${{ env.NODE_VERSION }}-${{ hashFiles('**/yarn.lock') }}
130
- restore-keys: ${{ runner.os }}-${{ env.NODE_VERSION }}-
131
-
132
113
  - name: Install dependencies
133
114
  run: yarn install --frozen-lockfile
134
- if: steps.cache-dependencies.outputs.cache-hit != 'true'
135
115
 
136
116
  - name: Download app
137
117
  uses: actions/download-artifact@v2
@@ -140,10 +120,9 @@ jobs:
140
120
  path: dist
141
121
 
142
122
  - name: Test
143
- uses: percy/exec-action@v0.3.1
144
- with:
145
- custom-command: yarn test:ember:${{ matrix.width }}-${{ matrix.height }} --path=dist
123
+ run: npx percy exec -- yarn test:ember --path=dist --test-port=${{ matrix.test-port }}
146
124
  env:
125
+ DEVICE: ${{ matrix.device }}
147
126
  PERCY_PARALLEL_NONCE: ${{ env.PERCY_PARALLEL_NONCE }}
148
127
  PERCY_PARALLEL_TOTAL: ${{ env.PERCY_PARALLEL_TOTAL }}
149
128
  PERCY_TOKEN: ${{ secrets.PERCY_TOKEN }}
@@ -153,9 +132,9 @@ jobs:
153
132
  name: Test compatibility
154
133
  runs-on: ubuntu-latest
155
134
  strategy:
135
+ fail-fast: false
156
136
  matrix:
157
137
  scenario:
158
- - 'ember-lts-3.16'
159
138
  - 'ember-lts-3.20'
160
139
  - 'ember-lts-3.24'
161
140
  - 'ember-release'
@@ -163,12 +142,17 @@ jobs:
163
142
  # - 'ember-canary'
164
143
  - 'embroider-safe'
165
144
  # - 'embroider-optimized'
166
- width:
167
- - 'w1'
168
- - 'w2'
169
- - 'w3'
170
- height:
171
- - 'h3'
145
+ device:
146
+ - 'w1-h3'
147
+ - 'w2-h3'
148
+ - 'w3-h3'
149
+ include:
150
+ - device: 'w1-h3'
151
+ test-port: 7363
152
+ - device: 'w2-h3'
153
+ test-port: 7364
154
+ - device: 'w3-h3'
155
+ test-port: 7365
172
156
  timeout-minutes: 5
173
157
  steps:
174
158
  - name: Check out a copy of the repo
@@ -177,26 +161,14 @@ jobs:
177
161
  - name: Use Node.js ${{ env.NODE_VERSION }}
178
162
  uses: actions/setup-node@v2
179
163
  with:
164
+ cache: 'yarn'
180
165
  node-version: ${{ env.NODE_VERSION }}
181
166
 
182
- - name: Get Yarn cache path
183
- id: yarn-cache-dir-path
184
- run: echo "::set-output name=dir::$(yarn cache dir)"
185
-
186
- - name: Cache Yarn cache and node_modules
187
- id: cache-dependencies
188
- uses: actions/cache@v2
189
- with:
190
- path: |
191
- ${{ steps.yarn-cache-dir-path.outputs.dir }}
192
- node_modules
193
- key: ${{ runner.os }}-${{ env.NODE_VERSION }}-${{ matrix.scenario }}-${{ hashFiles('**/yarn.lock') }}
194
- restore-keys: ${{ runner.os }}-${{ env.NODE_VERSION }}-${{ matrix.scenario }}-
195
-
196
167
  - name: Install dependencies
197
168
  run: yarn install --frozen-lockfile
198
- if: steps.cache-dependencies.outputs.cache-hit != 'true'
199
169
 
200
170
  # Test compatibility without Percy
201
171
  - name: Test
202
- run: yarn test:ember-compatibility ${{ matrix.scenario }} --- yarn test:ember:${{ matrix.width }}-${{ matrix.height }}
172
+ run: yarn test:ember-compatibility ${{ matrix.scenario }} --- yarn test:ember --test-port=${{ matrix.test-port }}
173
+ env:
174
+ DEVICE: ${{ matrix.device }}
package/CHANGELOG.md CHANGED
@@ -1,3 +1,27 @@
1
+ ## 2.0.0-alpha.0 (2021-12-12)
2
+
3
+ ### Breaking Change
4
+ * [#94](https://github.com/ijlee2/ember-container-query/pull/94) Dropped support for Node 10 ([@ijlee2](https://github.com/ijlee2))
5
+ * [#93](https://github.com/ijlee2/ember-container-query/pull/93) Dropped support for 3.16 LTS ([@ijlee2](https://github.com/ijlee2))
6
+
7
+ ### Internal
8
+ * [#74](https://github.com/ijlee2/ember-container-query/pull/74) Replaced ember-did-resize-modifier with ember-on-resize-modifier ([@st-h](https://github.com/st-h))
9
+ * [#100](https://github.com/ijlee2/ember-container-query/pull/100) Updated development dependencies to their latest version ([@ijlee2](https://github.com/ijlee2))
10
+ * [#97](https://github.com/ijlee2/ember-container-query/pull/97) Updated ember-source to v3.28.6 ([@ijlee2](https://github.com/ijlee2))
11
+ * [#96](https://github.com/ijlee2/ember-container-query/pull/96) Updated dependencies to their latest version ([@ijlee2](https://github.com/ijlee2))
12
+
13
+ ### Documentation
14
+ * [#104](https://github.com/ijlee2/ember-container-query/pull/104) Updated style and tests for demo app ([@ijlee2](https://github.com/ijlee2))
15
+ * [#102](https://github.com/ijlee2/ember-container-query/pull/102) Removed @percy/exec-action (deprecated) ([@ijlee2](https://github.com/ijlee2))
16
+ * [#103](https://github.com/ijlee2/ember-container-query/pull/103) Applied timeout to all rendering and application tests ([@ijlee2](https://github.com/ijlee2))
17
+ * [#101](https://github.com/ijlee2/ember-container-query/pull/101) Added a form example to the demo app ([@ijlee2](https://github.com/ijlee2))
18
+ * [#99](https://github.com/ijlee2/ember-container-query/pull/99) Replaced custom caching strategy with one built into @actions/setup-node ([@ijlee2](https://github.com/ijlee2))
19
+
20
+ ### Committers: 2
21
+ - Isaac Lee ([@ijlee2](https://github.com/ijlee2))
22
+ - Steve ([@st-h](https://github.com/st-h))
23
+
24
+
1
25
  ## 1.1.9 (2021-08-25)
2
26
 
3
27
  ### Bug Fix
package/README.md CHANGED
@@ -286,9 +286,9 @@ For more examples, I encourage you to check out the code for my demo app. It is
286
286
  Compatibility
287
287
  ------------------------------------------------------------------------------
288
288
 
289
- * Ember.js v3.16 or above<sup>1</sup> (3.12 - 3.15 may work but won't be supported)
290
- * Ember CLI v2.13 or above
291
- * Node.js v10 or above
289
+ * Ember.js v3.20 or above<sup>1</sup>
290
+ * Ember CLI v3.20 or above
291
+ * Node.js v12 or above
292
292
  * Modern browsers<sup>1</sup> (IE 11 won't be supported)
293
293
 
294
294
  <sup>1. Until you can adopt Ember Octane and drop support for IE 11, I recommend using [`ember-fill-up`](https://github.com/chadian/ember-fill-up) to do container queries. The APIs are similar so your migration should be smooth. Chad Carbert and I will ensure that the addons are maintained side-by-side for some time.</sup>
@@ -3,7 +3,7 @@
3
3
  class="container-query"
4
4
  data-test-container-query
5
5
  {{did-insert this.queryContainer}}
6
- {{did-resize this.queryContainer debounce=this.debounce}}
6
+ {{on-resize this.onResize}}
7
7
  ...attributes
8
8
  >
9
9
  {{yield (hash
@@ -1,6 +1,7 @@
1
1
  import { action } from '@ember/object';
2
2
  import Component from '@glimmer/component';
3
3
  import { tracked } from '@glimmer/tracking';
4
+ import { debounce } from '@ember/runloop';
4
5
 
5
6
  export default class ContainerQueryComponent extends Component {
6
7
  @tracked queryResults = {};
@@ -23,6 +24,17 @@ export default class ContainerQueryComponent extends Component {
23
24
  // The dynamic tag is restricted to be immutable
24
25
  tagName = this.args.tagName ?? 'div';
25
26
 
27
+ @action onResize(resizeObserverEntry) {
28
+ const element = resizeObserverEntry.target;
29
+
30
+ if (this.debounce > 0) {
31
+ debounce(this, this.queryContainer, element, this.debounce);
32
+ return;
33
+ }
34
+
35
+ this.queryContainer(element);
36
+ }
37
+
26
38
  @action queryContainer(element) {
27
39
  this.measureDimensions(element);
28
40
  this.evaluateQueries();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ember-container-query",
3
- "version": "1.1.9",
3
+ "version": "2.0.0-alpha.0",
4
4
  "description": "Container queries using Ember modifiers",
5
5
  "keywords": [
6
6
  "container-queries",
@@ -34,17 +34,9 @@
34
34
  "lint:js": "eslint . --cache",
35
35
  "lint:js:fix": "eslint . --fix",
36
36
  "start": "ember serve",
37
- "test": "npm-run-all --aggregate-output --continue-on-error --parallel test:ember:*",
38
- "test:ember:w1-h1": "DEVICE='w1-h1' percy exec -- ember test --test-port=7357",
39
- "test:ember:w2-h1": "DEVICE='w2-h1' percy exec -- ember test --test-port=7358",
40
- "test:ember:w3-h1": "DEVICE='w3-h1' percy exec -- ember test --test-port=7359",
41
- "test:ember:w1-h2": "DEVICE='w1-h2' percy exec -- ember test --test-port=7360",
42
- "test:ember:w2-h2": "DEVICE='w2-h2' percy exec -- ember test --test-port=7361",
43
- "test:ember:w3-h2": "DEVICE='w3-h2' percy exec -- ember test --test-port=7362",
44
- "test:ember:w1-h3": "DEVICE='w1-h3' percy exec -- ember test --test-port=7363",
45
- "test:ember:w2-h3": "DEVICE='w2-h3' percy exec -- ember test --test-port=7364",
46
- "test:ember:w3-h3": "DEVICE='w3-h3' percy exec -- ember test --test-port=7365",
47
- "test:ember-compatibility": "ember try:one"
37
+ "test": "DEVICE='w3-h3' ember test",
38
+ "test:ember": "ember test",
39
+ "test:ember-compatibility": "./node_modules/.bin/ember try:one"
48
40
  },
49
41
  "changelog": {
50
42
  "labels": {
@@ -57,66 +49,66 @@
57
49
  }
58
50
  },
59
51
  "dependencies": {
60
- "@ember/render-modifiers": "^1.0.2",
52
+ "@ember/render-modifiers": "^2.0.0",
61
53
  "ember-cli-babel": "^7.26.6",
62
- "ember-cli-htmlbars": "^5.7.1",
63
- "ember-did-resize-modifier": "^1.0.0",
64
- "ember-element-helper": "^0.5.5"
54
+ "ember-cli-htmlbars": "^6.0.0",
55
+ "ember-element-helper": "^0.5.5",
56
+ "ember-on-resize-modifier": "^0.4.5"
65
57
  },
66
58
  "devDependencies": {
67
59
  "@ember/optional-features": "^2.0.0",
68
- "@ember/test-helpers": "^2.4.2",
69
- "@embroider/test-setup": "^0.43.5",
60
+ "@ember/test-helpers": "^2.6.0",
61
+ "@embroider/test-setup": "^0.47.2",
70
62
  "@glimmer/component": "^1.0.4",
71
63
  "@glimmer/tracking": "^1.0.4",
72
- "@percy/cli": "^1.0.0-beta.67",
64
+ "@percy/cli": "^1.0.0-beta.71",
73
65
  "@percy/ember": "^3.0.0",
74
66
  "babel-eslint": "^10.1.0",
75
67
  "broccoli-asset-rev": "^3.0.0",
76
- "d3-array": "^3.0.2",
68
+ "d3-array": "^3.1.1",
77
69
  "d3-axis": "^3.0.0",
78
- "d3-scale": "^4.0.0",
70
+ "d3-scale": "^4.0.2",
79
71
  "d3-selection": "^3.0.0",
80
72
  "d3-shape": "^3.0.1",
81
- "ember-a11y-testing": "^4.2.0",
82
- "ember-auto-import": "^2.1.0",
83
- "ember-cli": "~3.27.0",
73
+ "ember-a11y-testing": "^4.3.0",
74
+ "ember-auto-import": "^2.2.4",
75
+ "ember-cli": "~3.28.4",
84
76
  "ember-cli-dependency-checker": "^3.2.0",
85
- "ember-cli-dependency-lint": "^2.0.0",
77
+ "ember-cli-dependency-lint": "^2.0.1",
86
78
  "ember-cli-inject-live-reload": "^2.1.0",
87
79
  "ember-cli-netlify": "^0.4.1",
88
80
  "ember-cli-sri": "^2.1.1",
89
81
  "ember-cli-terser": "^4.0.2",
90
- "ember-css-modules": "^1.5.0",
82
+ "ember-css-modules": "^2.0.0",
91
83
  "ember-disable-prototype-extensions": "^1.1.3",
92
84
  "ember-export-application-global": "^2.0.1",
93
85
  "ember-load-initializers": "^2.1.2",
94
- "ember-maybe-import-regenerator": "^0.1.6",
95
- "ember-page-title": "^6.2.2",
96
- "ember-qunit": "^5.1.4",
97
- "ember-resolver": "^8.0.2",
98
- "ember-source": "~3.27.2",
86
+ "ember-maybe-import-regenerator": "^1.0.0",
87
+ "ember-page-title": "^7.0.0",
88
+ "ember-qunit": "^5.1.5",
89
+ "ember-resolver": "^8.0.3",
90
+ "ember-source": "~3.28.8",
99
91
  "ember-source-channel-url": "^3.0.0",
100
92
  "ember-svg-jar": "^2.3.3",
101
- "ember-template-lint": "^3.6.0",
93
+ "ember-template-lint": "^3.14.0",
102
94
  "ember-test-selectors": "^6.0.0",
103
95
  "ember-truth-helpers": "^3.0.0",
104
- "ember-try": "^1.4.0",
96
+ "ember-try": "^2.0.0",
105
97
  "eslint": "^7.32.0",
106
98
  "eslint-config-prettier": "^8.3.0",
107
- "eslint-plugin-ember": "^10.5.4",
99
+ "eslint-plugin-ember": "^10.5.8",
108
100
  "eslint-plugin-node": "^11.1.0",
109
- "eslint-plugin-prettier": "^3.4.1",
110
- "lerna-changelog": "^2.1.0",
101
+ "eslint-plugin-prettier": "^4.0.0",
102
+ "lerna-changelog": "^2.2.0",
111
103
  "loader.js": "^4.7.0",
112
104
  "npm-run-all": "^4.1.5",
113
- "prettier": "^2.3.2",
114
- "qunit": "^2.16.0",
115
- "qunit-dom": "^1.6.0",
116
- "webpack": "^5.51.1"
105
+ "prettier": "^2.4.1",
106
+ "qunit": "^2.17.2",
107
+ "qunit-dom": "^2.0.0",
108
+ "webpack": "^5.64.4"
117
109
  },
118
110
  "engines": {
119
- "node": "10.* || >= 12"
111
+ "node": "12.* || 14.* || >= 16"
120
112
  },
121
113
  "ember": {
122
114
  "edition": "octane"