October: Flash message will be shown twice

Created on 16 May 2017  路  14Comments  路  Source: octobercms/october

Expected behavior

Flashmessage shows each message once.

Actual behavior

Userinteraction will lead to a Flashmessage. After Pagerefresh this message is shown once. If the user refreshes the page again (or visits another one) the same message will be shown once more. It will not show up a third time.

Here's a video showing the bug in action using the rainlab user login:
https://youtu.be/nk8jGKkGNiE

Reproduce steps

I have multiple occasions where this happens, even with the UserLogin Plugin.
Thise code will show 2 messages,regardless what happens

public function onBannerSave()
    {
        if(Input::file('banner') != null)
        {
            try
            {
                //[..not relevant..]
                Flash::success('Banner updated successfully!');
            }
            catch(Exception $e)
            {
                Flash::error($e->getMessage());
            }
            finally
            {
                return Redirect::refresh();
            }
        }
        else
        {
            Flash::warning('No Banner provided!');
        }
    }

This code will show only one message

public function onBannerSave()
    {

            try
            {
                //[..not relevant..]
                Flash::success('Banner updated successfully!');
            }
            catch(Exception $e)
            {
                Flash::error($e->getMessage());
            }
            finally
            {
                return Redirect::refresh();
            }
    }

This is my errorhtml:

<div class="fixed-top container" style="z-index:9999999;top:5%">
    <div class="row">

        {% flash %}
        <div class="errorMSG col-12 alert alert-{%if type == 'error'%}danger wow shake{%else%}{{type}}{%endif%}">
            <button type="button" class="close" data-dismiss="alert">x</button>
            <strong>{{type|capitalize}}</strong> {{ message }}
        </div>
        {% endflash %}
    </div>

</div>


  jQuery(document).ready(function () {
        if (jQuery(".errorMSG") == null)
            return;
        jQuery(".errorMSG").alert();
        jQuery(".errorMSG").fadeTo(3000, 500).slideUp(500, function () {
            jQuery(".errorMSG").slideUp(500);
        });

    });
October build

419

Archived Revision Needed Unconfirmed Bug

Most helpful comment

Adding this in Flashbag.php fixes the issue :

public function getMessages()
{
        $messages = $this->messages();
        $this->purge();
        return $messages;
 }

All 14 comments

Perhaps you could prepare a simple theme that demonstrates the issue.

I had this problem too. I had the framework js two times in my theme. Perhaps you have the same.

@SebastiaanKloos you mean the framework tag?

That's unfortunetly not the case:
image

I'll try to get the theme thing done throughout the weekend.

Thanks @kealsera, the code provided in the original post looks fine. A theme would help us understand what's going on here.

@daftspunk Took me a lil longer to compile that theme, sorry for that.

https://www.dropbox.com/s/edcej26mnmszdtg/clean.zip?dl=0

I've created a page which will create an error - this error will show up if you go to home a second time before it disappears.

https://www.dropbox.com/s/aeee5o33bafje7i/clean.zip?dl=0

@kealsera I think, problem is in Cms\Twig\FlashNode on line ->write('foreach (Flash::getMessages() as $type => $messages) {'.PHP_EOL) where method Flash::getMessages() do not forget flash messages, so they are visible after next refresh (than purge in October\Rain\Flash\FlashBag constructor happen)

Quick fix is to create method public function getMessagesAndForget() { $messages = $this->messages; $this->forget(); return $messages; } in October\Rain\Flash\FlashBag and use this one instead.

I can confirm, that this issue is still present. Can anybody provide example of theme, where this problem does not exist? In my theme I display flash messages like this:

{% flash %}
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-default">
                <div class="panel-body">
                    <div class="alert alert-{{ type }}">
                    {{ message }}
                    </div>
                </div>
          </div>

        </div>
    </div>
{% endflash %}

Is it ok?
EDIT:
I just spotted weird thing. Flash messages handling is not present in any of most popular official themes, while there are used in one of the most important plugin which is User plugin. It is true even for official example for user (Vanilla theme). Why is that?

still present, attached sample theme:

foo.zip

@saleksin because those theme authors haven't implemented it.
@frank-beta could you look into making a PR to fix the issue?

@LukeTowers a total newbie here, the PR is to confirm the bug? obviously I don't know how to fix it...

@kealsera @mkelcik Could you two look into making a PR to fix it as well?
@frank-beta the Pull Request is to fix the bug :) Nobody here knows how to fix the bug until they actually try to do so. If they did, it would already be fixed. I'd encourage you to dig in and read the code and try to understand fully what's going on enough to provide a fix for the issue, it'd be a very educational experience.

Adding this in Flashbag.php fixes the issue :

public function getMessages()
{
        $messages = $this->messages();
        $this->purge();
        return $messages;
 }

Messages can be shown twice if you're requesting ajax from an element (ex: button or link) and haven't specified the data-request-flash attribute (within the button or link tag).

Closing as it has been over a month since any activity on this occurred and we are trying to figure out what issues are still relevant. If this is still something that you would like to see through to fruition please respond and we can get the ball rolling.

Was this page helpful?
0 / 5 - 0 ratings