Reminder to re-add Safari 9 tests after this is addressed:
PolymerElements/app-localize-behavior#65 (comment)

Why is px-alert-message using polymer-font-awesome instead of using Predix defined px-iconography-design library?

Looks like 076be13 may have introduced a regression in the localization behavior that causes the component to fail to load in some browsers. (Failing tests here.)

@benoitjchevalier or @randyaskin - could either of you take a look when you have a chance? Think you two have been deep into the localization switch, right? Thanks.

Expected behavior and actual behavior:

Component should load correctly in Safari. Right now it fails to load because of a thrown TypeError coming from the _computeLocalize method.

Steps to reproduce the problem:

Open the px-alert-message demo page in Safari 9 or Safari 10. The page will fail to load correctly and an error will be logged to the console:

Environment:

• Mac OS X 10.11.6
• Safari 9.1.2
• px-alert-message v0.9.6

The message text appears at the top of the page outside the px-alert-message div (screen shot attached)

Gist: https://gist.github.com/adeetshah/f9275f7aeca60a8821d5

Render: https://gist.github.com/adeetshah/d4a6e9e4273f7459962b

With the latest version, I'm getting this reference error in the browser, and it's not showing up.

I'd like to use the px-alert-message in a dynamic way where the app will do something that should result in displaying the alert message. I guess that use case should be pretty common.

Generating and adding px-alert-message dynamically to the DOM is not a problem.
I was wondering however how to get rid of the elements from the tree once the user dismisses the component.

Is there any particular reason why those elements are left in the DOM tree after being dismissed/closed/hidden? Are there any use cases where they would be shown again after being dismissed?

What would allow to remove the element from the tree by the clients is some kind of event fired when the message is dismissed. I assume that the clients should be able to get a handle of the element containing the message that was dismissed - that should be catered for if a standard event mechanism is used. Could you please add such an event (maybe named 'alert-dismissed' or something along the lines) ?

When PolymerElements/app-localize-behavior#74 is fixed, added Safari 9 back into set of machines sauce tests against.

When I put AndroidTestDeviceForLongNameModelTestingTheDonutChart in the message field. The alert message and the action button will go out of bound. I can duplicate it in the predix ui website.

This is inside an Angular App. Not able to use type="custom" and input unique icons/images.

Expected behavior and actual behavior:

Expected: ability to provide custom icons on left-hand side of message
Actual: Repeated px-alert-message on top trying to fit in the icon div

Steps to reproduce the problem:

Copied custom type demo html from GitHub

Environment (component version number, Browser (including version), operating system, hardware, etc):

component version: "px-alert-message": "^0.5.4",
Browser: Chrome Version 52.0.2743.116 (64-bit)
Mac Os

Screenshots (optional, but very helpful):

Code examples help us better understand the issue - follow the CodePen or jsfiddle, templates, which both use polygit, to help explain the issue.

Hi!

For integration with other frameworks (for instance, AngularJS) I think it would be really helpful to provide callback for message disappearing. It allow to track state and remove elements from DOM when needed.

Hi,

Is there a way I can pass a relative route of the application to the 'action' property ? Also instead of having the button text as 'Open', I would like to have the text 'View'. The url passed is a relative path of the application and when clicked, it should open in the same window.

Thanks,
Anirban

Hi,
We have requirement to show 2 different actions in the toast message e.g ok & cancel. Where one action will continue the state and the other will stop the state of the action. Could not find a way to support it with current implementation.

Also, would like to provide the text to the buttons as input to override the default texts.

Thanks,
Priyabrat

Is it possible to have any string element (example: '!' ) within the diamond warning icon ?

Using the dismiss or any other action will sometimes give a blank box as the action button. So if there is no auto dismiss the alert message never goes away. This happens intermittently. Sometimes to works, sometimes it doesn't. I have the most up to date version of px-alert-message.
<px-alert-message type="custom" message-title="title" message="message" action="dismiss">

Is there any way to have a callback function associated on the button click within the alert message ?

Expected behavior and actual behavior:

https://www.predix-ui.com/#/elements/px-alert-message has a link to https://www.predix-ui.com/bower_components/px-alert-message/demo/demo.html which should show "Full-screen demo with several px-alert-messages in a queue." as per link title.

In reality, the linked page appears incomplete and upon inspecting the console, is ridden with errors.

Steps to reproduce the problem:

open this link: https://www.predix-ui.com/bower_components/px-alert-message/demo/demo.html

Environment (component version number, Browser (including version), operating system, hardware, etc):

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/72.0.3626.119 Safari/537.36

Screenshots (optional, but very helpful):

                             <px-alert-message
                        type="important"
                         message-title="Heads up!"
                         message="This definitely needs our attention."
                            action="https://www.predix.io/"
                          auto-dismiss="5000">
                    </px-alert-message>

message-title and message attributes not working .

Hi,

Vulcanizing break action button (no action after click, no icon on button). Does anyone noticed this or it's issue related only to my app (i.e. conflicts with other components, styles) or to vulcanizing itself?

Thanks

Expected behavior and actual behavior:

If the message is long, I may want to default the px-alert-message to "expanded" mode. This doesn't work as I expected. I don't want my user to have to click "Show more".

Steps to reproduce the problem:

Set expanded property in HTML or JS. Set message to a long string.

Environment (component version number, Browser (including version), operating system, hardware, etc):

Chrome 63 on Mac

Code example

https://codepen.io/anon/pen/jYWjaN?&editors=1001

Hi There,

visible: boolean = false property is not working as expected.

visible=true or visible=false both are showing the alert box. only removing visible property to hide the alert box on load.

Is there anyway to make visible =false so that we can update true/false dynamically when needed ?

Numbers given in the alert message are irrelevant to the end user. these should be configurable.

Submit an Issue

Hi,

Thanks for helping us improve the Predix UI platform by submitting an issue.

Before you begin, please check the list of existing issues to avoid submitting a duplicate issue.

To help us solve this issue as fast as possible, please fill out the following sections:

Expected behavior and actual behavior:

Steps to reproduce the problem:

Environment (component version number, Browser (including version), operating system, hardware, etc):

Screenshots (optional, but very helpful):

Code examples help us better understand the issue - follow the appropriate codepen for the component by going to https://predix-ui.com, finding the component in question, and clicking on the pencil icon under the demo.

    Once you've created your code example, you can save it under a new url.
    Please note that you should NOT use the same methods for production as the ones used in codepen - these methods are not production ready.

Message is truncated in firefox if the message-title and message are long. Chrome is fine.

e.g.

        <px-alert-message
            type="error"
            message-title="A configuration package must be deployed to the device before you can deploy software packages."
            message="Schedule configuration package deployments earlier than software package deployments.">
        </px-alert-message>

Show error message when async function call was failed

• auto dismiss need to be reset when show error message

Hi,
in px-alert-message is there a way to insert line break at the end of the sentence, when 2 sentences with a line break are passed a string to messageTitle property?
Currently it doesn't seem to read the new line in the string.
If i pass:
'ABcsdf
sdfk'
in message Title, it shows 'ABcsdf sdfk' itself is shown.
Is there a support in px-alert-message to break the string at full stop or read the newline break in message inserted in messageTitle property?
If not, is there going to be any provision in the future?
Need urgent help on this issue. Thanks in advance.

Submit an Issue

Hi,

Thanks for helping us improve the Predix UI platform by submitting an issue.

Before you begin, please check the list of existing issues to avoid submitting a duplicate issue.

To help us solve this issue as fast as possible, please fill out the following sections:

Expected behavior and actual behavior:

Steps to reproduce the problem:

Step 1: component fixture is as follows:

<div class="alert-message-div"> <template is="dom-if" if="{{noDropdownSelectionMsg}}"> <px-alert-message id="error-noDropDown-Select" type="important" message-title="[[errors.noDropdownTitle]]" message="[[errors.noDropdownMessage]]" action="acknowledge" language="en"> </px-alert-message> </template> </div>

but I get this

I wanted to find out if this can be addressed so I can get the 'OK' text back.

Thanks

The following loop is running forever in Win Firefox and cause firefox to show the stop long running script popup.

// the following code is always true in Window Firefox
while(messageDiv.scrollHeight > messageDiv.offsetHeight) {
....
}

I think adding a threshold will stop the compare
while((messageDiv.scrollHeight - messageDiv.offsetHeight) >=** this._threshold**) {
.....
}

type in a long non-breaking word and it'll display outside of the box.

The expected behavior is that the button 'show more' would only show on alert messages that have text longer than 3 lines.

1. Open new-demo branch and run the demo.
2. select 'long message' tab
3. select other tab and the 'show more' button does not disappear

Branch new-demo

Expected:

Bug:

possible problem:
We suspect that there are life-cycle issues with when _checkMessageLength function is being called/implemented. https://github.com/PredixDev/px-alert-message/blob/master/px-alert-message.html#L352

1. From the demo where the message is long and has the 'Show More' link
2. click the link to show more
3. Change the message title from the input
4. click the 'show less' then 'show more' again, the title reverts back to its original value

Is it possible to show html table structure in alert message, I have tried to display message in html table but it showing string instead of table like below image.

Is there any way to display html component in message?

For firing an alert message triggered by an event, the component itself does not take a property that replicates behavior like ng-show. Do we have an demo for such kind of implementation for this component ?