Reference error: genre and errors are not defined while rendering genre_form and author_form templates

[martinezdylanok]

Before submitting the issue, check you have done the following:

• [X] Issue can be reproduced on this repository following quick-start instructions.
• [X] I am using a clean/fresh database
• [X] I have included output logs and information about my environment setup below.

What was incorrect, unhelpful, or unexpected?

Following the steps of the Express Tutorial Part6: Working with forms and I found that after defining the CREATE and POST route for both genre and author controllers, the following error appears on the screen while rendering the new created form templates:

_genreform.ejs template:

<form method="POST">
<div class="form-group">
<label for="name">Genre:</label>
<input id="name" class="form-control" type="text" placeholder="Fantasy, Poetry etc." name="name" required-value="<%= genre ? genre.name : '' %>">
</div>
<button class="btn btn-primary" type="submit">Submit</button>
</form>

genre is not defined

_authorform.ejs template:

<% if (errors) { %>
   <ul>
   <% errors.forEach(function(error) { %>
      <li><%= error.msg %></li>
   <% }) %>
   </ul>
<% } %>

errors is not defined

What did you expect to see?

The expected output is that the template files render without any errors, as the genre and erros where defined in the controller to then being passed to the template files as arguments.

Output logs

No response

Do you have anything more you want to share?

I'm using EJS as a template engine for this project instead of the default PUG

[github-actions[bot]]

It looks like this is your first issue. Welcome! 👋 One of the project maintainers will be with you as soon as possible. We appreciate your patience. To safeguard the health of the project, please take a moment to read our code of conduct.

[martinezdylanok]

The solution I found is to add and empty genre object and errors array in the genreController _genre_createget method:

export const genre_create_get = (req, res, next) => {
   res.render("genre_form", { title: "Create Genre", genre: {}, errors: [] });
};

And an empty errors array in the authorController _author_createget method:

export const author_create_get = (req, res, next) => {
   res.render("author_form", { title: "Create Author", errors: [] });
};

With this, the templates will render without any errors.

[hamishwillee]

This isn't a bug because the tutorial is very much Pug focused, and Pug does not raise these errors. However it would be good to at least hint that other templates might do things differently.

I've raised https://github.com/mdn/content/pull/34643 which explains what Pug does with undefined variables and makes that hint.

Thanks for taking the time to post!

[martinezdylanok]

Thank you @hamishwillee ! I'm more than willing to help out if it's needed.