Issue templates/playground online

[flexseth]

Requirements

Enable issue templates on GitHub

What is this PR doing?

Introduces an issue template that is fairly complete for playground.wordpress.net
AKA "Playground online"

What problem is it solving?

Provides guidance when creating a new issue for playground.wordpress.net

How is the problem addressed?

Created an issue template

Testing instructions

• Check out the issue template

[adamziel]

Thanks @flexseth! This is a very thorough template, to the point where it may be scary to a new person coming in to report their problem. I, for once, would probably give up before reading the entire thing. How short can we make this, while still retaining the most important points? Could it be, e.g., a short paragraph of text and a checklist?

[flexseth]

@adamziel - check it out now, still too complicated?

Is there a way to test as if you were going to create a new issue, without merging it?

It for sure looks different in the New issue UI I feel like...

[adamziel]

Looking better, thank you! A few notes:

• Some sections feature HTML comments, some feature plain text, others feature both. Let's stick to one style. Same for headers, sometimes it's ##, sometimes it's **.
• The example list illustrating steps to reproduce isn't very clear, let's use a few more words like "1. I clicked ..., 2. I saw ..., 3. I expected ... instead".
• In markdown you typically add a newline below headers. Two newlines typically mean an additional <br> tag. Let's make sure each header has a single newline above and below.

[adamziel]

Also there's some duplication between these:

## Journey to reproduce issue
1. Go to '...'
2. Expected
3. What happened
4. See errors - if applicable


## Expected behavior
A clear and concise description of what you expected to happen.

The Error reporting feels unnecessary for now, not many errors hinged on a specific WP version.

[flexseth]

Looking better, thank you! A few notes:

• Some sections feature HTML comments, some feature plain text, others feature both. Let's stick to one style. Same for headers, sometimes it's ##, sometimes it's **.

HTML comment tags - they won't show up on the issue front-end

I can take a look at the other part. Think I adapted it, thank you for the review

• The example list illustrating steps to reproduce isn't very clear, let's use a few more words like "1. I clicked ..., 2. I saw ..., 3. I expected ... instead".

Ok, didn't know what to put there. Maybe even just removing the steps all together and let them write what they are experiencing? Leads to more triage, but also helps resolve more issues which could become some sort of knowledge base

• In markdown you typically add a newline below headers. Two newlines typically mean an additional <br> tag. Let's make sure each header has a single newline above and below.

Heard

[adamziel]

Ok, didn't know what to put there. Maybe even just removing the steps all together and let them write what they are experiencing? Leads to more triage, but also helps resolve more issues which could become some sort of knowledge base

It could be something to this effect:

## What happened? (step by step)

1. I went to https://playground.wordpress.net/ and clicked ...
2. I then clicked ...
3. And ... happened

## What did you expect to happen instead?

<!-- Fill in the blank :) -->

## Blueprints, screenshots, additional context

<!-- If you used a Blueprint, have a screenshot to share, or any other relevant thoughts, put them here -->

## Console errors

<!-- Please include the output from your web browser console. If you're not sure how to do that, see https://support.google.com/docs/thread/1873663/collecting-console-logs-chrome-browser-only   -->

[ironnysh]

Suggestion: add a GitHub workflow to auto-label issues when submitting (see example on WordPress Learn)

[flexseth]

Suggestion: add a GitHub workflow to auto-label issues when submitting (see example on WordPress Learn)

Not a bad idea at all! There have been quite a few more labels added to this repo

h/t to @adamziel for the implementation!

What would be really cool is if we could set up a GitHub Action to search for and label certain issues, based on search criteria found in the subject and issue description.

Adding to internal ideas so it won't get lost

[flexseth]

@ironnysh - is there a way you can pick up this PR and get it past the finish line?

I'm not great at looking at revisions across branches, which may be what's happening here.

Text wise, should be accurate. Might be one unresolved comment but easy to resolve.

Let me know what you think!

[ironnysh]

Hey @flexseth, yup, I'll take a look tomorrow!

[ironnysh]

Hey @flexseth, there were a few changes needed before merging, but I'd need to create a fork of your repo/branch to be able to update this PR. 🫠

Would you mind doing that? Let me know if not, and I'll open a new PR to get this sorted.

Here's what you need to do:

1. Pull the changes from the main repo and sync your working branch (fixes the “This branch is out-of-date with the base branch” situation).
2. Create a directory named ISSUE_TEMPLATE under .github.
3. Rename the file to bug_report_template.md and move it into this directory.
4. Update the content based on the following copy.

Revised text:

---
name: Bug report
about: Reporting bugs and errors in the online version of Playground (playground.wordpress.net)
title: Bug report - 
labels: [Type] Bug
assignees: ''
---

<!--
Thank you for submitting feedback!
You can see if similar issues have already been reported by searching https://github.com/WordPress/wordpress-playground/issues.
-->

## Describe the bug

<!-- What didn't work as expected? -->

## How can we reproduce it? (step-by-step)

<!--
1. I went to https://playground.wordpress.net/ and clicked ...
2. I then clicked ...
4. And ... happened
-->

## Blueprints, screenshots, more context

<!-- If you've used a Blueprint, captured a screenshot, or have any other relevant information, please share it here. -->

### Console errors

<!-- Please include the output from your web browser console and note your browser, device, and operating system. Not sure how to do that? Search for "Collecting console logs" + your browser's name. -->

[flexseth]

@ironnysh - I'll take a look at this tonight to get it fixed. Thanks for the instructions, I'm a bit rusty :)