@ember-learn/guides-source - npm Package Compare versions

Comparing version 3.2.6 to 3.3.0

guides/v3.1.0/templates/binding-element-attributes.md

@@ -43,3 +43,3 @@ In addition to normal text, you may also want to have your templates
 
-By default, helpers and components only accept a limited number of HTML attributes.
+By default, components only accept a limited number of HTML attributes.
 This means that some uncommon but perfectly valid attributes, such as `lang` or
@@ -50,29 +50,23 @@ custom `data-*` attributes must be specifically enabled. For example, this template:
 {{#link-to "photos" data-toggle="dropdown" lang="es"}}Fotos{{/link-to}}
-
-{{input type="text" data-toggle="tooltip" data-placement="bottom" title="Name"}}
 ```
 
-renders the following HTML:
+Will render the following HTML:
 
 ```html
 <a id="ember239" class="ember-view" href="#/photos">Fotos</a>
-
-<input id="ember257" class="ember-view ember-text-field" type="text"
-       title="Name">
 ```
 
-To enable support for these attributes an attribute binding must be
-added to the component, e.g.
+To enable support for these attributes, an attribute binding must be
+added for each specific attribute on the component.
+To do this, you can extend the appropriate components
+in your application. For example, for `link-to` you would create your own version
+of this component by extending
 [`Ember.LinkComponent`](https://www.emberjs.com/api/ember/release/classes/LinkComponent)
-or [`Ember.TextField`](https://www.emberjs.com/api/ember/release/classes/TextField)
-for the specific attribute:
 
-```javascript
-Ember.LinkComponent.reopen({
+```javascript {data-filename="app/components/link-to/component.js"}
+import LinkComponent from '@ember/routing/link-component';
+
+export default LinkComponent.extend({
   attributeBindings: ['data-toggle', 'lang']
 });
-
-Ember.TextField.reopen({
-  attributeBindings: ['data-toggle', 'data-placement']
-});
 ```
@@ -83,6 +77,3 @@
 ```html
-<a id="ember240" class="ember-view" href="#/photos" data-toggle="dropdown" lang="es">Fotos</a>
-
-<input id="ember259" class="ember-view ember-text-field"
-       type="text" data-toggle="tooltip" data-placement="bottom" title="Name">
+<a id="ember239" class="ember-view" href="#/photos" data-toggle="dropdown" lang="es">Fotos</a>
 ```

guides/v3.2.0/models/finding-records.md

@@ -9,3 +9,7 @@ The Ember Data store provides an interface for retrieving records of a single type.
 ```javascript
-let blogPost = this.get('store').findRecord('blog-post', 1); // => GET /blog-posts/1
+// GET /blog-posts/1
+this.get('store').findRecord('blog-post', 1)
+  .then(function(blogPost) {
+    // Do something with `blogPost`
+  });
 ```
@@ -17,3 +21,4 @@
 ```javascript
-let blogPost = this.get('store').peekRecord('blog-post', 1); // => no network request
+// no network request
+let blogPost = this.get('store').peekRecord('blog-post', 1);
 ```
@@ -26,3 +31,7 @@
 ```javascript
-let blogPosts = this.get('store').findAll('blog-post'); // => GET /blog-posts
+// GET /blog-posts
+this.get('store').findAll('blog-post')
+  .then(function(blogPosts) {
+    // Do something with `blogPosts`
+  });
 ```
@@ -33,3 +42,4 @@
 ```javascript
-let blogPosts = this.get('store').peekAll('blog-post'); // => no network request
+// no network request
+let blogPosts = this.get('store').peekAll('blog-post');
 ```
@@ -36,0 +46,0 @@

guides/v3.2.0/templates/binding-element-attributes.md

@@ -43,3 +43,3 @@ In addition to normal text, you may also want to have your templates
 
-By default, helpers and components only accept a limited number of HTML attributes.
+By default, components only accept a limited number of HTML attributes.
 This means that some uncommon but perfectly valid attributes, such as `lang` or
@@ -50,29 +50,23 @@ custom `data-*` attributes must be specifically enabled. For example, this template:
 {{#link-to "photos" data-toggle="dropdown" lang="es"}}Fotos{{/link-to}}
-
-{{input type="text" data-toggle="tooltip" data-placement="bottom" title="Name"}}
 ```
 
-renders the following HTML:
+Will render the following HTML:
 
 ```html
 <a id="ember239" class="ember-view" href="#/photos">Fotos</a>
-
-<input id="ember257" class="ember-view ember-text-field" type="text"
-       title="Name">
 ```
 
-To enable support for these attributes an attribute binding must be
-added to the component, e.g.
+To enable support for these attributes, an attribute binding must be
+added for each specific attribute on the component.
+To do this, you can extend the appropriate components
+in your application. For example, for `link-to` you would create your own version
+of this component by extending
 [`Ember.LinkComponent`](https://www.emberjs.com/api/ember/release/classes/LinkComponent)
-or [`Ember.TextField`](https://www.emberjs.com/api/ember/release/classes/TextField)
-for the specific attribute:
 
-```javascript
-Ember.LinkComponent.reopen({
+```javascript {data-filename="app/components/link-to/component.js"}
+import LinkComponent from '@ember/routing/link-component';
+
+export default LinkComponent.extend({
   attributeBindings: ['data-toggle', 'lang']
 });
-
-Ember.TextField.reopen({
-  attributeBindings: ['data-toggle', 'data-placement']
-});
 ```
@@ -83,6 +77,3 @@
 ```html
-<a id="ember240" class="ember-view" href="#/photos" data-toggle="dropdown" lang="es">Fotos</a>
-
-<input id="ember259" class="ember-view ember-text-field"
-       type="text" data-toggle="tooltip" data-placement="bottom" title="Name">
+<a id="ember239" class="ember-view" href="#/photos" data-toggle="dropdown" lang="es">Fotos</a>
 ```

guides/v3.2.0/tutorial/autocomplete-component.md

@@ -315,3 +315,3 @@ As they search for a rental, users might also want to narrow their search to a specific city.
 
-  test('should initially load all listings', function (assert) {
+  test('should initially load all listings', async function (assert) {
   });
@@ -318,0 +318,0 @@

guides/v3.2.0/tutorial/simple-component.md

@@ -321,3 +321,3 @@ As a user looks through our list of rentals, they may want to have some interactive options to help them make a decision.
 ```javascript {data-filename="tests/integration/components/rental-listing-test.js" data-diff="+3,+4"}
-test('should display rental details', function(assert) {
+test('should display rental details', async function(assert) {
   await render(hbs`{{rental-listing rental=rental}}`);
@@ -324,0 +324,0 @@ assert.equal(this.$('.listing h3').text(), 'test-title', 'Title: test-title');

guides/v3.3.0/models/finding-records.md

@@ -9,3 +9,7 @@ The Ember Data store provides an interface for retrieving records of a single type.
 ```javascript
-let blogPost = this.get('store').findRecord('blog-post', 1); // => GET /blog-posts/1
+// GET /blog-posts/1
+this.get('store').findRecord('blog-post', 1)
+  .then(function(blogPost) {
+    // Do something with `blogPost`
+  });
 ```
@@ -17,3 +21,4 @@
 ```javascript
-let blogPost = this.get('store').peekRecord('blog-post', 1); // => no network request
+// no network request
+let blogPost = this.get('store').peekRecord('blog-post', 1);
 ```
@@ -26,3 +31,7 @@
 ```javascript
-let blogPosts = this.get('store').findAll('blog-post'); // => GET /blog-posts
+// GET /blog-posts
+this.get('store').findAll('blog-post')
+  .then(function(blogPosts) {
+    // Do something with `blogPosts`
+  });
 ```
@@ -33,3 +42,4 @@
 ```javascript
-let blogPosts = this.get('store').peekAll('blog-post'); // => no network request
+// no network request
+let blogPosts = this.get('store').peekAll('blog-post');
 ```
@@ -36,0 +46,0 @@

guides/v3.3.0/templates/binding-element-attributes.md

@@ -43,3 +43,3 @@ In addition to normal text, you may also want to have your templates
 
-By default, helpers and components only accept a limited number of HTML attributes.
+By default, components only accept a limited number of HTML attributes.
 This means that some uncommon but perfectly valid attributes, such as `lang` or
@@ -50,29 +50,23 @@ custom `data-*` attributes must be specifically enabled. For example, this template:
 {{#link-to "photos" data-toggle="dropdown" lang="es"}}Fotos{{/link-to}}
-
-{{input type="text" data-toggle="tooltip" data-placement="bottom" title="Name"}}
 ```
 
-renders the following HTML:
+Will render the following HTML:
 
 ```html
 <a id="ember239" class="ember-view" href="#/photos">Fotos</a>
-
-<input id="ember257" class="ember-view ember-text-field" type="text"
-       title="Name">
 ```
 
-To enable support for these attributes an attribute binding must be
-added to the component, e.g.
+To enable support for these attributes, an attribute binding must be
+added for each specific attribute on the component.
+To do this, you can extend the appropriate components
+in your application. For example, for `link-to` you would create your own version
+of this component by extending
 [`Ember.LinkComponent`](https://www.emberjs.com/api/ember/release/classes/LinkComponent)
-or [`Ember.TextField`](https://www.emberjs.com/api/ember/release/classes/TextField)
-for the specific attribute:
 
-```javascript
-Ember.LinkComponent.reopen({
+```javascript {data-filename="app/components/link-to/component.js"}
+import LinkComponent from '@ember/routing/link-component';
+
+export default LinkComponent.extend({
   attributeBindings: ['data-toggle', 'lang']
 });
-
-Ember.TextField.reopen({
-  attributeBindings: ['data-toggle', 'data-placement']
-});
 ```
@@ -83,6 +77,3 @@
 ```html
-<a id="ember240" class="ember-view" href="#/photos" data-toggle="dropdown" lang="es">Fotos</a>
-
-<input id="ember259" class="ember-view ember-text-field"
-       type="text" data-toggle="tooltip" data-placement="bottom" title="Name">
+<a id="ember239" class="ember-view" href="#/photos" data-toggle="dropdown" lang="es">Fotos</a>
 ```

guides/v3.3.0/tutorial/autocomplete-component.md

@@ -315,3 +315,3 @@ As they search for a rental, users might also want to narrow their search to a specific city.
 
-  test('should initially load all listings', function (assert) {
+  test('should initially load all listings', async function (assert) {
   });
@@ -318,0 +318,0 @@

guides/v3.3.0/tutorial/simple-component.md

@@ -321,3 +321,3 @@ As a user looks through our list of rentals, they may want to have some interactive options to help them make a decision.
 ```javascript {data-filename="tests/integration/components/rental-listing-test.js" data-diff="+3,+4"}
-test('should display rental details', function(assert) {
+test('should display rental details', async function(assert) {
   await render(hbs`{{rental-listing rental=rental}}`);
@@ -324,0 +324,0 @@ assert.equal(this.element.querySelector('.listing h3').textContent.trim(), 'test-title', 'Title: test-title');

package.json

 {
   "name": "@ember-learn/guides-source",
-  "version": "3.2.6",
+  "version": "3.3.0",
   "description": "Markdown files for Ember-Guides",
@@ -5,0 +5,0 @@ "homepage": "https://github.com/ember-learn/guides-source#readme",

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

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

Worsened metrics

Total package byte prevSize

39988335

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes