Smartedit decorator mappings in 6.5

[former_member646215]

Good day!

Would be nice with some help locating any potential errors, as i have clearly misunderstood something or gone blind to my own code.

I am trying to register a new decorator in the Hybris 6.5 smartedit, but no cigar. The following steps have been taken:

1. Installed Smartedit including its dependencies

2. Tested out of the box extensions, and everything seems to work as intended.

3. Created a custom extension following the guide here: https://help.hybris.com/6.5.0/hcd/6d55d5fba206425b9acecda9f2311483.html

4. Uncommented and imported the project data.

5. Tested the new extension. Data loads fine, no console errors. The AB analytics toolbar item and perspective loads, but not the component decorators. All tests are green.

6. Created a new sample component following this guide: https://help.hybris.com/6.5.0/hcd/7cebd4f5dc2a430fbe878f88baf2bd9c.html

7. Fixed the few bugs and simplified the code a bit. Ran grunt through "ant build", passes build.

8. Checked that it loads correctly through chrome console. No apparent errors.

9. Played around with mappings, tried static component names as well as different regex and restrict combinations. Ran grunt every time code was updated.

Here is the code:

.../web/features/mysmarteditmodule/sampleDecorator/sampleDecorator.js:

 angular.module('sampleDecoratorModule', ['mysmarteditmoduleTemplates'])
     .directive('sampleDecorator', function() {
         return {
             templateUrl: 'web/features/mysmarteditmodule/sampleDecorator/sampleDecoratorTemplate.html',
             restrict: 'C',
             transclude: true,
             replace: false,
             scope: {
                 smarteditComponentId: '@',
                 smarteditComponentType: '@',
                 active: '='
             },
 
             link: function($scope) {
                 $scope.visible = false;
                 $scope.mouseleave = function() {
                     console.log("Mouse leave");
                 };
                 $scope.mouseenter = function() {
                     console.log("Mouse enter");
                 };
             }
         };
     });
 

.../web/features/mysmarteditmodule/sampleDecorator/sampleDecoratorTemplate.html:

 <div>
     <div data-ng-mouseleave="mouseleave()" data-ng-if="active">
         <div data-ng-mouseenter="mouseenter()">
             <div data-ng-transclude></div>
             <span id='decoratorText'>decorator wired</span>
         </div>
     </div>
     <div data-ng-mouseleave="mouseleave()" data-ng-if="!active">
         <div data-ng-transclude></div>
     </div>
 </div>

.../web/features/mysmarteditmodule/mysmarteditmodule.js:

 angular.module('mysmarteditmodule', [
         'decoratorServiceModule',
         'sampleDecoratorModule'
     ])
     .run(function(decoratorService) {
 
         decoratorService.addMappings({
             '*': ['sampleDecorator']
         });
     });

As you can see i removed the AB analytics module for simplification. So this decorator should print some text on mouse enter or leave on all components, which it does not.

Am i missing something here? Do i need to register it for a specific perspective? If so, the guide does not reflect this.

[Former Member]

Hi !

Any news on this? I actually try to add a decorator on hybris 6.6 and have the same problems.

Any hints on this would be great!

Thanks, Andreas

[Former Member]

Better late than never. If the problem still exist try this:

 angular.module('mysmarteditmodule', [
         'sampleDecoratorModule',
         'decoratorServiceModule'
     ])
     .run(function(decoratorService) {
 
         decoratorService.addMappings({
             '*': ['sampleDecorator']
         });
 
         decoratorService.enable('sampleDecorator');
     });

Would be great if you can respond if this work.

Beste regards