-
Notifications
You must be signed in to change notification settings - Fork 181
Brackets Smoke Tests
Brackets has a pretty good automated test suite that you can run from Debug > Run Tests, but that doesn't always cover issues with the overall UI and integrated functionality, or visual/layout issues that are only obvious if you're actually looking at the product. This is a set of manual tests intended to make sure we haven't broken the basic overall workflows of the product. The intention is to keep it quick--if it takes more than 5 minutes on a given platform it's too long.
There are also Brackets server smoke tests.
If you have trouble running through it or something is unclear, please post to the brackets-dev mailing list.
- Make sure your
git status
is clean and your user extensions folder andsrc/extensions/dev
folders are both empty (git status will not tell you about these folders). - Quit and relaunch Chrome if it's open (so it's not in remote debugger mode).
- If you've run the smokes previously, revert any changes you might have made in
brackets/test/smokes/citrus completed
. - Delete your cache folder (Mac:
~/Library/Application\ Support/Brackets/cef_data
, Win:%appdata%\Brackets\cef_data
, Linux:~/.config/Brackets/cef_data
). - Move your state.json file aside (rename it to state.json.bak or something if you want to get it back). (Mac:
~/Library/Application\ Support/Brackets/state.json
, Win:%appdata%\Brackets\cef_data
, Linux:~/.config/Brackets/state.json
) - Disable any 3rd party extensions you've installed (see Extension Locations)
-
Launch Brackets. Verify that the Brackets "Getting Started" folder is visible in the project panel and its index.html file is opened automatically and there is a single pane showing in the main view.
-
File > Open Folder
and browse to the Brackets source folder. -
Click on the triangle next to the project name. The dropdown should show the "Open Folder..." option, then the "Getting Started" folder.
-
From the Finder/Explorer, create a new folder called "watch". Observe that the new folder appears in the file tree in a closed state.
-
From the Finder/Explorer, rename the "watch" folder to "watcher". Observe that the folder is renamed in the file tree and remains in a closed state.
-
From the Finder/Explorer window, copy the README.md file from the project into the watcher folder. Confirm that NO CHANGES take place in the file tree.
-
Expand the "watcher" folder in the project tree and observe the copied README.md file. From the Finder/Explorer, delete the copied README.md file. Observe that the copied file is removed from the project tree and that the watcher folder remains expanded.
-
From the Finder/Explorer, delete the watcher folder and observe that it is removed from the file tree.
-
Switch back to the "Getting Started" folder using the project dropdown, verifying that it switches back to the previous project and shows its index.html.
-
Switch back to the "brackets" folder using the project dropdown.
-
Expand some folders in the brackets project, enough that it has to scroll.
-
Scroll around in the folder area. Verify that the shadows look right (appears at top when not scrolled all the way to the top) and there are no visual glitches.
-
From the Finder/Explorer window, drag the
brackets/test/smokes/citrus completed
folder onto Brackets. In the Project panel, verify that the folder opened and it contains "css" and "images" folders and an "index.html" file. -
From the Finder/Explorer window, drag the
brackets/test/smokes/citrus completed/index.html
file onto Brackets. Verify that the file is opened, selected, and added to the working set. -
File > New
-
File > Save
, name the filetemp.js
in the current project. Verify that the name in the working set and title bar changes totemp.js
and the mode in the status bar changes to "JavaScript". -
Type the following code
var foo = ""; function add(a, b) { return a+b; } foo.
-
Verify
String
method code hints onfoo
-
Replace the last line with
add(
-
Verify that the parameter hint
Object a, Object b
appears withObject a
in boldface -
Type
5, 10);
and press enter -
Type
add(
-
Verify that the parameter hint
Number a, Number b
appears with theNumber a
in boldface -
File > New
-
Change the language mode to Javascript from bottom-right dropdown.
-
Verify that code coloring is applied.
-
Repeat the steps 17 to 23.
-
Install some extensions from Extension Manager (eg. Theme Editor, Beautify) and perform Debug Menu - > Reload with Extensions 3-4 times (Brackets should get the Extension installed on reloading with Extensions).
-
Install some extensions from Extension Manager and perform Debug Menu -> Reload Without Extensions 3-4 times (Brackets should not have the installed Extensions on reloading without Extensions).
-
File > New
-
Change the encoding to EUC-JP and copy the following content
水面から跳ね返っていく水滴
海水常温常圧では無味、無臭、ごくわずかに青緑色を呈す透明の液体である。地球表面、特に海洋に豊富に存在する。生物の生存、日常生活をはじめ、工業や医療などに不可欠であり、人類にとって最も身近な物質の一つである。人体の60%から70%程度が水である。この様に身近である水だが、宇宙全体から見ると液体の水として存在している量は少ない。
固体は氷、液体は水、気体は水蒸気と呼ばれる。温度の高い液体の水を湯(ゆ)と言い、特に温度の高いものを熱湯(ねっとう)と言う。理・工学的な分野では熱水(ねっすい)という語も用いられる。
- Save the file as euc-jp.css and then close it.
- Try to reopen the file it should display the contents as desired.
- In the project tree, right-click on
temp.js
and choose "Rename". Rename the file totemp.txt
. Verify that the name in the working set and title bar changes, the code coloring disappears and the mode changes to "Text". - In the project tree, right click on
temp.txt
and choose delete (when prompted discard changes) - Open the OS Trash/Recycle Bin and confirm
temp.txt
was deleted - Verify that index.html is now current file. Move mouse over the name of the source of an
<img>
tag (e.g. "images/events.jpg" on line 33). Verify that Hover Preview of the image is displayed properly with the width and height. - Set the cursor in the
<body>
tag immediately before the>
. - Enter a space. Verify that a list of attribute hints pops up and you can navigate the list with up/down arrow keys. Hit
Enter
, verify that item was inserted in page properly, thenundo
. - Hit
Ctrl-space
and verify hint list is invoked. HitEsc
key to dismiss the code hints list, then delete the space so the cursor is after the "y" of "body". - Hit
Cmd/Ctrl-E
. Verify that it shows a single body rule and that everything is laid out properly. - With
View > Themes...
, change the theme from Brackets Light to Brackets Dark (or vice-versa, depending on what your standard theme is). Make sure that both the host editor and the inline editor look correct, then switch back to your normal theme. - In the native shell menu, choose
View > Increase Font Size
. Verify both the host and inline editors font size increases. The inline editor should not show a vertical scrollbar. - Click the Lightning Bolt in the upper right. If you moved your
state.json
file, you'll get an info dialog explaining how live preview works. Hit OK. - You should see the page load in Chrome.
- Back in Brackets, bring the cursor to main editor(not inline editor) to any line except line 26.
- In Preview Window(Chrome instance opened by Brackets) click on "A new neighborhood ", the cursor in Brackets should shift to line 26 just before the
<article
. Verify that the box containing that text and the image to the right is highlighted (with a blue outline around it) in the browser. - Back in Brackets, on line 26, put the cursor after "A new".
- Type
and totally <em>AWESOME</em> local
; let the<em>
tag autocomplete (you can arrow or click select after the</em>
to typelocal
). Verify while typing an incomplete tag<em
that the gutter and the live preview lightning bolt icon show a pink error color. Verify that the changes appear in the browser as you type, and verify that AWESOME is italicized (and nothing else is). - Undo the file back to a clean state. Verify that as you undo, the HTML preview continues to match the current state of the document, and ends up looking the same as when you first opened the file.
- Edit the background color for the
<body>
tag in the inline editor (#D90
is a nice color). Verify that the color changes in Chrome as you type. Also verify that the CSS file is added to the working set with the dirty bit set. - Hit
Cmd/Ctrl-E
. Verify that the inline editor closes. - Put the cursor after the
<a
in one of the navbar items and hitCmd/Ctrl-E
to open another inline editor. - Scroll up and down in the outer editor. Verify that the inline editor scrolls properly with the editor.
- Resize the window. Verify that the rule list moves properly and there are no visual glitches.
- Hit
Esc
to close the inline editor. - Type
class="huge"
, place the cursor inhuge
and hit Cmd/Ctrl-E. The inline editor should open with a message saying there are no matching rules, and focus should be on the New Rule button. - Click the New Rule button and choose desktop.css. A blank
.huge
rule should appear in the inline editor. Typefont-size: 30px;
and verify that the navbar item gets huge. - Switch to
desktop.css
and verify that the rule you added is at the end of the file. -
File > Extension Manager
then, in the search box, type "emmet" and clickInstall
thenClose
- Verify the
Emmet
menu was added - Quit the app. Verify that you get a "save changes" dialog for any CSS files you edited through the inline editor, and choose to discard the changes.
- Restart the app. Verify that the "citrus completed" project shows in the sidebar, and that the working set and current editor are showing the same files as when you quit. Also verify that the changes you had previously made were reverted (
git status
in the smokes folder should show clean). -
File > Close All
and verify that all files are closed. - Double-click on
index.html
in the file tree and verify that it is open and added to the working set. -
View > Vertical Split
and verify a second pane is created and is given focus.index.html
should still be open in the left pane and is listed in the "Left" working set. - Expand the CSS folder in the file tree and double-click on
desktop.css
to open it in the right pane and verify it is added to the "Right" working set. - Drag the splitter between the two views back and forth and verify there are no visual glitches and the 2 editors resize appropriately.
- Switch to another project and then back to citrus and verify the view is still split, splitter is where you left it, and the same files are open.
- In the sidebar, drag the
index.html
file from the "Left" working set and verify that you can drop it into the "Right" working set, and that it is no longer displayed int he left pane. - Drag it back to the empty "Left" working set and verify that it is once again displayed in left pane.
- Click Split View icon at top of sidebar, choose
No Split
, and verify there is now only a single pane displayed and all open files are listed in the Working Files list.