Move from the demo to a real website

The method stays the same when you leave the practice page: choose a small behavior, find the relevant elements, perform the actions, and check the result. The address and selectors usually change.

Begin with a website or preview that you manage. A preview is a copy of an application used to review changes before they reach its main audience. Ask your teammate for the right preview address and a simple behavior to check.

Start again with a manual plan

1. Open the real page in your normal browser.
2. Choose one small task, such as submitting a contact form with practice information.
3. Write the starting condition, exact inputs, action, and expected result.
4. Perform the task yourself once.
5. Identify selectors for the controls and message you actually used.

Do this before copying the demo’s commands. The selector #project belongs to our practice form. Your website might use #subject or need a selector based on another attribute.

Also confirm what success means. A visible confirmation may be enough for a small check of the user interface—the part of the website people see and interact with. If the requirement is that an order is stored on a server, checking the visible message alone does not prove that it was stored.

Change the address and the expectation together

Here is a starting template for a page-title check. The address and title are placeholders. Replace both before running it:

base_url "https://your-preview.example/"

test "my preview page opens"
  navigate "."
  expect title "Your actual browser-tab title"
end

Once that check passes, add one useful interaction. Build up a little at a time. If you change the address, selectors, inputs, and assertions all at once, a failure becomes harder to explain.

Understand relative addresses

A relative address is interpreted using the base URL. With a base of https://example.com/shop/, navigate "contact/" goes to https://example.com/shop/contact/.

A leading slash changes the meaning. navigate "/contact/" starts at the website’s root, so it goes to https://example.com/contact/. It leaves out /shop/.

Keep navigate "." when you mean the exact base directory. The demo tests use this pattern so they can work at the published /bruster/demo/ path or at the root of a local server.

Optional: run your own local copy of the demo

A local server serves a website from your own computer. The address 127.0.0.1 points back to that computer. A port number, such as 8765, identifies the particular server running there.

1. Inside bruster-practice, create a folder named practice-site.
2. Download the practice HTML page and save it as practice-site/index.html.
3. If you do not have Python 3, install it from python.org. It is only needed for this optional local server.
4. Open a terminal in bruster-practice and run the server command below. Leave that terminal open.

python3 -m http.server 8765 --bind 127.0.0.1 --directory practice-site

py -m http.server 8765 --bind 127.0.0.1 --directory practice-site

Open http://127.0.0.1:8765/ in your browser. When the form appears, open a second terminal in bruster-practice and run:

./bruster test form-submit.bru --base-url http://127.0.0.1:8765/

.\bruster.exe test form-submit.bru --base-url http://127.0.0.1:8765/

The command-line --base-url overrides the address in the file for this run. You can use the same test without editing its saved URL. When finished, stop the local server with Ctrl+C in its terminal.