I had the opportunity to test a web page during a hands-on experience with GoIT company. The project contains the product specifications based on which the test cases were written in TestRail and also the bugs were identified and reported in Jira.

1. A source web Project
I had the opportunity to test a web page during a hands-on experience with GoIT company.
The project contains the product specifications based on which the test cases were written in TestRail
and also the bugs were identified and reported in Jira.
Link WebSite: https://qa-autocheck-
test.netlify.app/?token=d5fcc3783ba50fcac78b5a5ea8e4d69f6fe51ed8368bc618a58a846ad8b03a63&block=nop6
78917&language=ro&ssid=6414325608a1900a6826f703&cookie_id=df907bd4c3df4c1e9809aa8f4cd942af&block_i
d=640b56739ff8027ea86464e0&leeloo_account_id=6414325608a1907a3d26f6fe&utm_source=leeloo&utm_medi
um=ref&utm_campaign=FRO5&utm_term=FRO3_1-9
Components and functionality of Product
A web resource designed to familiarize you with the basics of HTML&CSS languages. This is intended for
users who have no programming knowledge.
The web resource consists of ten pages of questions. Each page has a theoretical part, which provides
enough information to solve a given task.
The web resource is adapted: it works on various devices, operating systems and browsers.
HEADER
1. Link to main site
In the right corner is placed the logo (link) to the main GoIT website.
2. Navigation menu
In the middle is the "Questions" navigation menu to switch between solved tasks:
 The "left" arrow opens the previous question.
 The button in the center, which shows the number of the current task and, via a slash "/", the
total number of tasks. Clicking on this button opens a solution list. Clicking on the button with
the task number in the list opens the page with the task in question.
 The "right" arrow opens the next task.

2. 3. Language menu
In the right corner is the language menu. When the "RO" version is highlighted, the content of the page
is displayed in Romanian. When the "ENG" symbol is highlighted, the page content is displayed in
English. change the language by pressing the version in question.
BODY
1. Theory section
It contains theory and explanations with examples needed to solve the given task, problem statement
and task acceptance criteria.
1.1. "Hide theory and assignments" button at the top of the section
When you click on this button, the Theory section closes and the editor window expands to the full
width of the page. The button shrinks to an icon with no text.

3. 1.2. The title of the theoretical part
When you click on the title, the main theoretical part of the theory section closes, only the task and the
criteria for accepting the task remain in the section.
Repeated clicking expands the theory section to its initial state.
2. Code editor window

4.  In the Editor window, there is a startup code that must be filled in according to the task to solve
it.
 You can only write code in the gray highlighted line where the cursor is set.
 The boot code cannot be changed.
 It is possible to insert characters at the end of blocked lines, but checking for such code will result
in a compile error.
3. Check menu
It is located between the code editor window and the results section.
3.1. "Check" button
When you click on the "Verify" button, a request is sent to the server to verify the code in the editor
window.
The answer is displayed in the results section. Items that pass the check are shown in green text, otherwise
they are shown in red. An example of boot code verification:

5. If the code in the editor window passes the check and all items in the results section are displayed in green
text, the text on the test button changes to "Next task":
Clicking on the "Next task" button opens the page with the next question.
3.2. "Reset" button
Intended to return the editor window to its original state. Thus all changes are canceled with a single click.
To prevent accidental resetting of the entered code, a modal window is provided with a request to confirm
the user's desire to reset the code to its initial state, which appears when the "Reset" button is clicked:
When you click on the "Yes" button in the modal window, the window closes, and the code in the editor
is reset to its initial state. The modal window can be closed by pressing "No", the gray background or the
"Esc" key - the code in the editor window does not change.
3.3. "Hide results section" button
When you click the "Hide results section" button, the section closes, the code editor window expands to
the full height of the page body, the validation menu moves to the bottom of the page, and the button
text changes to "Show results section ".

6. When clicking on the button "Show results section", the section expands to its initial state.
4. "Results" section
Designed to display code verification results in the editor window.
FOOTER
In the footer there is a link to the "Privacy Policy". When you click on the text, a modal window opens with
information about the privacy policy in the language corresponding to the version chosen in the header.
The modal window can be closed by pressing the cross in the upper right corner, the gray
background or the "Esc" key.

7. Test Cases

14. Bug Report