diff --git a/app/views/projects/blob/_bmpr.html.haml b/app/views/projects/blob/_bmpr.html.haml
index 36ec0cbcce8..573b24ae44f 100644
--- a/app/views/projects/blob/_bmpr.html.haml
+++ b/app/views/projects/blob/_bmpr.html.haml
@@ -1,4 +1,4 @@
- content_for :page_specific_javascripts do
= page_specific_javascript_bundle_tag('balsamiq_viewer')
-.file-content#js-balsamiq-viewer{ data: { endpoint: namespace_project_raw_path(@project.namespace, @project, @id) } }
+.file-content.balsamiq-viewer#js-balsamiq-viewer{ data: { endpoint: namespace_project_raw_path(@project.namespace, @project, @id) } }
diff --git a/spec/features/projects/blobs/balsamiq_preview_spec.rb b/spec/features/projects/blobs/balsamiq_preview_spec.rb
index 856ec3271a0..503f1f94915 100644
--- a/spec/features/projects/blobs/balsamiq_preview_spec.rb
+++ b/spec/features/projects/blobs/balsamiq_preview_spec.rb
@@ -7,18 +7,21 @@ feature 'Balsamiq preview', :feature, :js do
let(:project) { create(:project) }
let(:branch) { 'add-balsamiq-file' }
let(:path) { 'files/images/balsamiq.bmpr' }
+ let(:file_content) { find('.file-content') }
before do
project.add_master(user)
login_as user
- p namespace_project_blob_path(project.namespace, project, tree_join(branch, path))
-
visit namespace_project_blob_path(project.namespace, project, tree_join(branch, path))
end
- it 'should' do
- screenshot_and_open_image
+ it 'should show a loading icon' do
+ expect(file_content).to have_selector('.loading')
+ end
+
+ it 'should show a viewer container' do
+ expect(page).to have_selector('.balsamiq-viewer')
end
end
diff --git a/spec/support/test_env.rb b/spec/support/test_env.rb
index 1b5cb71a6b0..5765a31ca18 100644
--- a/spec/support/test_env.rb
+++ b/spec/support/test_env.rb
@@ -27,6 +27,7 @@ module TestEnv
'expand-collapse-files' => '025db92',
'expand-collapse-lines' => '238e82d',
'video' => '8879059',
+ 'add-balsamiq-file' => 'b89b56d',
'crlf-diff' => '5938907',
'conflict-start' => '824be60',
'conflict-resolvable' => '1450cd6',