Ember.js V5 - Fpe Observes

This automation refactors observer definitions in Ember.js from using the .observes method to the modern observer function syntax.

Ember.js
jscodeshift
Estimated time saving
5 minutes/occurrence
Change mode
Autonomous
Applicability criteria

Ember.js version higher or equal to 3.11.

Made by
Rajasegar Chandran
Rajasegar Chandran

Usage →

Codemod CLI:

intalling vs code extension tooltip icon
codemod ember/5/fpe-observes
copy CLI command icon

Codemod VS Code extension:

intalling vs code extension tooltip icon
vs code logo
Run in VS Code

Use/edit codemod in Codemod Studio:

intuita logo without text
Open in Codemod Studio

Description

This automation refactors observer definitions in Ember.js from using the .observes method to the modern observer function syntax.

Example

Before:

import EmberObject from '@ember/object';

export default EmberObject.extend({
	valueObserver: function () {
		// Executes whenever the "value" property changes
	}.observes('value'),
});

After:

import EmberObject from '@ember/object';

export default EmberObject.extend({
	valueObserver: observer('value', function () {
		// Executes whenever the "value" property changes
	}),
});