classNameBindings not working in flash-message.js about ember-flash-messages HOT 8 CLOSED

Showing just a single class is actually intentional. Class names are explained in the wiki. However, I appear to have left out the part about selectors (oops!).

I'm happy to change this functionality to bind both classes because it seems like people aren't used to the class structure and I'm not trying to introduce any new CSS concepts here. Ultimately, that would also remove the className property, which is a little confusing when compared to classNames, etc. Overall, a good move.

from ember-flash-messages.

Sorry, but I'm a bit confused. In the wiki chapter about the component class-name you state that a message with type: 'success' and className: 'alert' will have the following class names:

<dl class=".alert .alert-success"></dl>

Im my hands, it returns only the following class:

<dl class=".alert-success"></dl>

And this despite the right classNameBindings: ['className', 'typeClass', 'visible'] call.

And yes, switching from className to classNames would be great.

from ember-flash-messages.

Ah, you are correct - apologies. That's definitely a bug then. I can't look into it right now but will get a patch up by the weekend. Of course I'll accept a PR too if you are able to get one up sooner.

from ember-flash-messages.

Well, I'm not sure the bug is coming from your part. I'm if this is not coming from Ember #classNameBindings itself when a two classNames start with the same string. I'll try to verify this.

from ember-flash-messages.

Ok, I've found some time to look over it at lunch. Will report back shortly.

from ember-flash-messages.

The issue seems to lie in non-static messages. Static messages shown using the component (whether a block component or otherwise) have the correct class names (.flash_message .flash_message-success).

Both of the following work:

{{#flash-message type='hello'}}
  Testing block content {{#link-to 'index'}}and Handlebars{{/link-to}}
{{/flash-message}}

{{flash-message type='success' content='what?'}}

However, when the message is added to the queue, only the typeClass class name is present (.flash_message-success).

The key difference between the messages is that non-static messages are rendered in the message-queue.hbs template using the message property. The root of this issue in using the message property and the _setMessageProperties method of the flash message component.

Passing in type and content separately works as expected:

{{flash-message message=currentMessage}}{{!--Does not work--}}
{{flash-message content=currentMessage.content type=currentMessage.type}}{{!--Works--}}

I'll have a PR up to fix within the hour.

from ember-flash-messages.

The fix is a little more in depth than first thought because it's affecting the queues. I have a fix underway though.

from ember-flash-messages.

Resolved by #17 - thanks for your patience.

from ember-flash-messages.