Bug 915661 - [Gallery] Add Marionette tests

apps/gallery/test/marionette/delete_image_test.js

@@ -0,0 +1,47 @@
+var Gallery = require('./lib/gallery.js'),
+    Marionette = require('marionette-client'),
+    assert = require('assert'),
+    TestCommon = require('./lib/test_common');
+
+marionette('using the gallery menu', function() {
+
+  var app, client;
+
+  client = marionette.client({
+    prefs: {
+      'device.storage.enabled': true,
+      'device.storage.testing': true,
+      'device.storage.prompt.testing': true
+    }
+  });
+
+  setup(function() {
+    TestCommon.prepareTestSuite('pictures', client);
+    app = new Gallery(client);
+    actions = new Marionette.Actions(client);
+    app.launch();
+  });
+
+  test('should let you select images', function() {
+    // Use the 'selection' button and select the test image.
+    // Selected images should have an border/highlight.
+    app.thumbnailsSelectButton.click();
+    app.thumbnail.click();
+
+    var outline = app.thumbnail.cssProperty('outline');
+    assert.ok(outline != null);
+  });
+
+  test('should let you delete images', function() {
+    // This test deletes the test image.
+    app.thumbnailsSelectButton.click();
+    app.thumbnail.click();
+    app.thumbnailsDeleteButton.click();
+    app.confirmButton.click();
+
+    // Wait for the overlay with 'No photos or videos' message.
+    var overlayView = app.overlayView;
+    client.helper.waitForElement(overlayView);
+    assert.ok(overlayView.displayed());
+  });
+});

apps/gallery/test/marionette/edit_image_test.js

@@ -0,0 +1,101 @@
+var Gallery = require('./lib/gallery.js'),
+    Marionette = require('marionette-client'),
+    assert = require('assert'),
+    TestCommon = require('./lib/test_common');
+
+marionette('editing an image', function() {
+
+  var app, actions, client, chrome;
+
+  client = marionette.client({
+    prefs: {
+      'device.storage.enabled': true,
+      'device.storage.testing': true,
+      'device.storage.prompt.testing': true,
+      'webgl.force-enabled': true
+    }
+  });
+
+  setup(function() {
+    TestCommon.prepareTestSuite('pictures', client);
+    app = new Gallery(client);
+    actions = new Marionette.Actions(client);
+    app.launch();
+  });
+
+  test('should have different options', function() {
+    // You should be able to switch between the different 'operations'
+    // in the image editor.
+    app.thumbnail.click();
+    app.editButton.click();
+    app.waitForImageEditor();
+    assert.ok(app.exposureOptions.displayed());
+
+    app.editCropButton.click();
+    assert.ok(app.cropOptions.displayed());
+
+    app.editEffectButton.click();
+    assert.ok(app.effectOptions.displayed());
+
+    app.editBorderButton.click();
+    assert.ok(app.borderOptions.displayed());
+
+  });
+
+  test('should change exposure', function() {
+    // Changing the exposure of an image creates a new modified
+    // version of original.
+    app.thumbnail.click();
+    app.editButton.click();
+    app.waitForImageEditor();
+    app.editExposureButton.click();
+    actions.flick(app.exposureSlider, 0, 0, 50, 0).perform();
+    app.editSaveButton.click();
+    client.waitFor(function() {
+      return app.thumbnails.length == 2;
+    });
+    assert.strictEqual(app.thumbnails.length, 2);
+  });
+
+  test('should crop it', function() {
+    // Croping an image creates a new modified version of original.
+    app.thumbnail.click();
+    app.editButton.click();
+    app.editCropButton.click();
+    app.waitForImageEditor();
+    app.editCropAspectPortraitButton.click();
+    app.editSaveButton.click();
+    client.waitFor(function() {
+      return app.thumbnails.length == 2;
+    });
+    assert.strictEqual(app.thumbnails.length, 2);
+  });
+
+  test('should apply an effect', function() {
+    // Applying a sepia effect creates a new modified version of original.
+    app.thumbnail.click();
+    app.editButton.click();
+    app.editEffectButton.click();
+    app.waitForImageEditor();
+    app.editEffectSepiaButton.click();
+    app.editSaveButton.click();
+    client.waitFor(function() {
+      return app.thumbnails.length == 2;
+    });
+    assert.strictEqual(app.thumbnails.length, 2);
+  });
+
+  test('should add a border', function() {
+    // Add a border to an image creates a new modified version of original.
+    app.thumbnail.click();
+    app.editButton.click();
+    app.waitForImageEditor();
+    app.editBorderButton.click();
+    app.editBorderThickWhiteButton.click();
+    app.editSaveButton.click();
+    client.waitFor(function() {
+      return app.thumbnails.length == 2;
+    });
+    assert.strictEqual(app.thumbnails.length, 2);
+  });
+});

apps/gallery/test/marionette/fullscreen_image_test.js

@@ -0,0 +1,66 @@
+var Gallery = require('./lib/gallery.js'),
+    Marionette = require('marionette-client'),
+    assert = require('assert'),
+    TestCommon = require('./lib/test_common');
+
+marionette('the gallery', function() {
+
+  var app, client, actions;
+
+  client = marionette.client({
+    prefs: {
+      'device.storage.enabled': true,
+      'device.storage.testing': true,
+      'device.storage.prompt.testing': true,
+      'webgl.force-enabled': true
+    }
+  });
+
+  setup(function() {
+    TestCommon.prepareTestSuite('pictures', client);
+    app = new Gallery(client);
+    actions = new Marionette.Actions(client);
+    app.launch();
+  });
+
+  test('should only have one image present', function() {
+    // There should only be a single test image in the gallery
+    // after running the test suite setup.
+    // This mainly tests if TestCommon runs smoothly.
+    assert.strictEqual(app.thumbnails.length, 1);
+  });
+
+  test('should display an image fullscreen and go back', function() {
+    // You should be able to click on an image to view a fullscreen
+    // preview and go back by pressing the 'back' button.
+    app.thumbnail.click();
+    assert.ok(app.fullscreenView.displayed());
+
+    app.fullscreenBackButton.click();
+    assert.ok(app.thumbnailsView.displayed());
+  });
+
+  test('should flick through images in fullscreen mode', function() {
+    // Acquire a duplicate of an image by launching the editing
+    // mode and saving it.
+    app.thumbnail.click();
+    app.editButton.click();
+    app.waitForImageEditor();
+    app.editSaveButton.click();
+    client.waitFor(function() {
+      return app.thumbnails.length == 2;
+    });
+
+    // You should be able to swipe between the two in fullscreen mode.
+    app.thumbnail.click();
+    var translateX = app.getFrameTranslation(app.fullscreenFrame2);
+    assert.strictEqual(translateX, 0);
+
+    actions.flick(app.fullscreenFrame2, 0, 0, -300, 0).perform();
+
+    //Swiping centers the fullscreen view on the second frame.
+    translateX = app.getFrameTranslation(app.fullscreenFrame3);
+    assert.strictEqual(translateX, 0);
+  });
+
+});