Collision between Sprite and Tilemap doesn't work

[Fortvy]

My player sprite doesn't collide with the tilemap at all. I've also tried enabling physics for the layers and map, which doesn't work either. I also checked all other topics in this forum about collisions with a sprite and tilemap, but I still can't figure out the error.

Here's my code:

import { findObjectsByType, movePlayerTo } from './src/map.js';
import { checkPlayerMovement } from './src/movement.js';

const game = new Phaser.Game(window.innerWidth, window.innerHeight, Phaser.AUTO, '', { preload: preload, create: create, update: update, render: render }, false, false);
//The player sprite and properties
let player, properties = {};
//Settings
const worldScale = 2;
//Helpers
let cursors;
//Layers
let map, background, walls;

function preload() {
    //Load tiles
    game.load.spritesheet('tiles', 'assets/Tileset.png', 16, 16);
    game.load.tilemap('SafeZone1', 'assets/SafeZone1.json', null, Phaser.Tilemap.TILED_JSON);
}

function create() {
    //LOGIC
    game.stage.backgroundColor = "#1c1117";
    game.physics.startSystem(Phaser.Physics.ARCADE);
    setMap('SafeZone1');
    player = spawnPlayer(50, 50);
    cursors = game.input.keyboard.createCursorKeys();
    movePlayerTo(player, findObjectsByType('playerStart', map, 'objects')[0], worldScale);
    game.camera.follow(player, game.camera.FOLLOW_TOPDOWN_TIGHT);


    //Spawn the player
    function spawnPlayer(x, y) {
        const p = game.add.sprite(x, y, 'tiles', 132);
        game.physics.enable(p);
        p.scale.setTo(worldScale);
        p.body.collideWorldBounds = true;
        return p;
    }

    //Add the map with the given name and manipulate it accordingly.
    function setMap(mapName) {
        map = game.add.tilemap(mapName);
        map.addTilesetImage('Tileset', 'tiles');
        map.setCollisionBetween(0, 300); //All tiles

        walls = map.createLayer('walls');
        walls.scale.setTo(worldScale);

        background = map.createLayer('background');
        background.scale.setTo(worldScale);
        background.resizeWorld();
    }
}

function update() {
    game.physics.arcade.collide(player, map);
    
    if(cursors) checkPlayerMovement(player, cursors, 150);
}

function render() {
    game.debug.bodyInfo(player, 5, 20);
}

 

map.js

export function findObjectsByType(type, map, layer) {
    var result = [];
    map.objects[layer].forEach(function (element) {
        if (element.properties.type === type) {
            element.y -= map.tileHeight;
            result.push(element);
        }
    });
    return result;
}

export function createFromTiledObject(element, group) {
    var sprite = group.create(element.x, element.y, element.properties.sprite);
    Object.keys(element.properties).forEach(function (key) {
        sprite[key] = element.properties[key];
    });
}

export function movePlayerTo(player, element, worldScale) {
    player.x = element.x * worldScale;
    player.y = element.y * worldScale;
}

 

movement.js

export function checkPlayerMovement(player, cursors, speed) {
    const vel = player.body.velocity;
    vel.x = 0, vel.y = 0;
    if(cursors.left.isDown) vel.x = -speed;
    if(cursors.right.isDown) vel.x = speed;
    if(cursors.up.isDown) vel.y = -speed;
    if(cursors.down.isDown) vel.y = speed;
}

[Fortvy]

Problem solved. The Error was this bit:

walls.scale.setTo(worldScale);

I replaced it with the following bit and everything worked out fine:

walls.setScale(worldScale);

because apparently the collision layer doesn't get scaled.