Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Object-Oriented JavaScript: Challenge Rendering the Game startGame() Method Solution

Kendall McCall
Kendall McCall
5,648 Points

Uncaught TypeError: Cannot read properties of undefined (reading 'activeToken')

Someone please tell me what I'm missing here. When I click start game nothing happens and when I check the console I see "Game.js:34 Uncaught TypeError: Cannot read properties of undefined (reading 'activeToken')" but I've copied line by line code in the videos...

... class Game { constructor() { this.board = new Board(); this.players = this.createPlayers(); this.ready = false; }

    /** 
     * Returns active player.
     * @return  {Object}    player - The active player.
     */
    get activePlayer() {
        return this.players.find(player => player.active);
    }


    /** 
     * Creates two player objects
     * @return  {array}    An array of two player objects.
     */
    createPlayers() {
        const players = [new Player('Player 1', 1, '#e15258', true),
                         new Player('Player 2', 2, '#e59a13')];
        return players;
    }


    /** 
     * Initializes game. 
     */
    startGame(){
        this.board.drawHTMLBoard();
        this.activePlayer.activeToken.drawHTMLToken();
        this.ready = true;
    }



}
Steven Parker
Steven Parker
231,198 Points

The cause of the issue might be in a different part of the code, and this is why it's always a good idea to share the entire project. You might want to take a look at this video about sharing a snapshot of your workspace.

3 Answers

Steven Parker
Steven Parker
231,198 Points

First, there were a few upload issues. None of the js files could be found because the HTML was trying to load them from a "js" folder, and they were all currently stored in the top level folder. So I made a "js" folder and moved them all into it, and then the "Game.js" file couldn't be found because the file was named "game.js" (lower-case "g"). But after changing the file name I got your original error.

The reason the "activePlayer" getter in game is returning undefined is because it searches the players array for one that has an "active" property set to true, but as currently defined the "Player" class has no "active" property or getter method.

Kendall McCall
Kendall McCall
5,648 Points

aaaahhhh after sleeping on it I see.... I was trying to be different and named it "turn" so of course it wouldn't be found. Thanks!

Kendall McCall
Kendall McCall
5,648 Points

How do I do that with VScode

Steven Parker
Steven Parker
231,198 Points

If you create a new workspace and upload the project files into it, you can then make a snapshot and share the link to it.

But do try running it first in the workspace, to be sure it still has the same issue.

Kendall McCall
Kendall McCall
5,648 Points

hopefully that works I just copied and pasted the files IDK why index file showing error'd tags