(solved) Firefox - Images reloading everytime the server is updated

[junibegood]

Hello,

I experience a strange behaviour that I fail to understand. This happens only on Firefox. For some reason, Webkit-based browsers are fine.

Almost everytime I send an AJAX query, most or all images in my game are reloaded by the browser, as shown below (it's an animated GIF, please click on the thumbnail to see it on the hosting website). The most troubling part is that it does not always happen (but very often) and does not always apply to all cards, but I fail to see any kind of pattern in this.



In this example, the player does nothing and passes. Here is the JS code for this action

Code: Select all

onPassForward: function() {
    this.ajaxcall('/draconisinvasion/draconisinvasion/passForward.html', {
        lock: true
    }, this, function(result) {});
},

With this, the server does nothing besides sending a notification and changing the game state

Code: Select all

public function passForward()
{
    $activePlayer = $this->getActivePlayer();
    $this->game->notifyAll(
        'passForward',
        clienttranslate('${playerName} does not Forward'),
        [
            'playerName' => $activePlayer->getName(),
        ]
    );

    // Checks if game is over, otherwise switch to next player
    if ($this->game->getGameProgression() >= 100) {
        $this->game->gamestate->nextState('endGame');
    } else {
        $this->game->gamestate->nextState('passForward');
    }
}

Since the player did nothing, the notification is not subscribed because there is no animation to perform. The only effect client side is the display of the log message.

I suppose this is some kind of bug on Firefox side, but I can't see what's causing it. Did anybody experience a similar problem and know a workaround ?

[Victoria_La]

Where is this code? Its in game.php not in action.php right?
There are multiple issues with this code - but nothing that justify what you seeing, but it may be issue on the client,
when new state changes - check what you code does. Best just use js debugger to see exactly what caused this reload.

[junibegood]

Where is this code? Its in game.php not in action.php right?

It's in neither. It's a custom class called from action.php. That's why it looks different from what you're used to see.

Best just use js debugger to see exactly what caused this reload.

Well that's the problem. There is no custom JS code executed besides onLeavingState / onEnteringState / onUpdateActionButtons. The code in the first two were not needed to test so I commented it, and the problem is still there.

That leaves onUpdateActionButtons. I can't comment that because I need the buttons to test. But when I break on the first line in this function, the images are already reloaded, so the problem happens before that.

So to sum it up : I know that the problem happens somewhere between the moment the AJAX query is sent and the execution of onUpdateActionButtons when the answer is handled. I don't see how I could narrow it more unfortunately.

[Tisaac]

What is the size (mo and px) of your images ?

[junibegood]

It seems the problem is simply related to the way the cache in my Firefox install is set up. It does not only refresh the display, it performs a new GET query to retrieve the images. And not only the images from my game, but also some images from the studio itself.

That's what made me realize that the problem might not be related to my code at all. I installed another version of Firefox with a fresh profile, and the problem is gone.