this.get(...).each is not a function

[kickbk]

Getting this.get(...).each is not a function with the latest 0.12.58 version (cdn min.js).
The line that triggers it is return this.get("classes").each(function(e){return t.push(e.get("name"))})

[NicholasGati]

Just wondering, does this.get(...) return an array? If not, maybe you can try this:

const c = this.get("classes");
Array.from(c).forEach(e => t.push(e.get("name")));

Not sure if that's what the issue is but I figured I'd chime in and try to help :)

[ryandeba]

Hi @kickbk,

It is unclear what this is bound to in your code...is that a reference to a component? If you could create a jsfiddle to demonstrate the error, that would be very helpful.

I've not been able to recreate the error so far. I ran this code in the demo (which also currently uses version 0.12.58) after selecting a random component and it worked without errors:
t = []; editor.getSelected().get("classes").each(function(e) { t.push(e.get("name")) })

[kickbk]

Thanks for replying guys. I traced the issue to my custom components' Traits.
What's triggering it is that I load default values for traits:

export default (editor, {
	dc, opt, defaultModel, defaultView, coreMjmlModel, coreMjmlView
}) => {
	const type = 'mj-my-component';
  
	dc.addType(type, {

		model: defaultModel.extend({ ...coreMjmlModel,

			defaults: { ...defaultModel.prototype.defaults,
				'custom-name': 'Footer',
				draggable: '[data-type=mj-column]',
				droppable: false,
				stylable: [...],
				style: {...},
				traits: [
					{
						name: 'organization-content',
						label: 'Organization Name',
						default: 'TEST', // << HERE IS THE ISSUE
					},{...}
				],
...

As you can see my plugin extends on grapesjs-mjml.

Changing default to value gives the same error.

Is this the wrong way to load defaults to traits?

[artf]

Hi @kickbk and thanks for the debugging, I was able to reproduce it and fix it.
The issue was the loading of Traits before Classes
https://github.com/artf/grapesjs/blob/dev/src/dom_components/model/Component.js#L167-L168
The fix is ready and will be available in the next release

[kickbk]

Hi @artf glad you found the cause and fixed. It's causing your grapesjs-mjml to fail, like the demo page which doesn't load. Is this issue related to the Traits default value overriding chosen values when updating styles? See GrapesJS/mjml#50

[artf]

Yeap, I updated the site with a temporary release, thanks

[kickbk]

@artf thanks for pushing a temporary release. It's still running into issues with the Social component in mjml. Steps to reproduce: add "google" to the "display" string. Click on the Styles tab, select an icon color for Facebook and watch the Google button disappear.

I debugged this and for some reason when you update styles (handleStyleChange()) it loads the default trait/style value disregarding the trait updated value, so in the case of "display" it reverts to the default set in Social.js under components.

I spent a few hours on it and still can't pinpoint the issue.

BTW "style-default" doesn't really work. Changing to "style" bring shows the default icon colors.

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.