From e3171a42a3c504c3884e3fe6afe1d80fd55a8cf4 Mon Sep 17 00:00:00 2001 From: Andrew Nacin Date: Sat, 29 Mar 2014 10:05:22 +0000 Subject: [PATCH] Add PHP and JS unit tests for custom headers. props mcsf, ehg. see #21785. git-svn-id: https://develop.svn.wordpress.org/trunk@27847 602fd350-edb4-49c9-b593-d223f7449a82 --- Gruntfile.js | 2 +- tests/phpunit/tests/image/header.php | 145 ++++++++++++++++++ tests/qunit/fixtures/customize-header.js | 46 ++++++ tests/qunit/index.html | 26 ++-- .../{sinon-qunit-1.0.0.js => sinon-qunit.js} | 0 .../qunit/vendor/{sinon-1.8.2.js => sinon.js} | 0 tests/qunit/wp-admin/js/customize-header.js | 108 +++++++++++++ 7 files changed, 316 insertions(+), 11 deletions(-) create mode 100644 tests/phpunit/tests/image/header.php create mode 100644 tests/qunit/fixtures/customize-header.js rename tests/qunit/vendor/{sinon-qunit-1.0.0.js => sinon-qunit.js} (100%) rename tests/qunit/vendor/{sinon-1.8.2.js => sinon.js} (100%) create mode 100644 tests/qunit/wp-admin/js/customize-header.js diff --git a/Gruntfile.js b/Gruntfile.js index 04731e8140..b25b8dba7a 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -191,7 +191,7 @@ module.exports = function(grunt) { tests: { src: [ 'tests/qunit/**/*.js', - '!tests/qunit/vendor/qunit.js', + '!tests/qunit/vendor/*', '!tests/qunit/editor/**' ], options: grunt.file.readJSON('tests/qunit/.jshintrc') diff --git a/tests/phpunit/tests/image/header.php b/tests/phpunit/tests/image/header.php new file mode 100644 index 0000000000..282aac2365 --- /dev/null +++ b/tests/phpunit/tests/image/header.php @@ -0,0 +1,145 @@ +custom_image_header = new Custom_Image_Header( '__return_null' ); + } + + function test_header_image_has_correct_dimensions_with_max_width() { + global $_wp_theme_features; + + $_wp_theme_features['custom-header'][0]['max-width'] = 1600; + $_wp_theme_features['custom-header'][0]['width'] = 1200; + $_wp_theme_features['custom-header'][0]['height'] = 230; + $_wp_theme_features['custom-header'][0]['flex-width'] = false; + $_wp_theme_features['custom-header'][0]['flex-height'] = false; + + $dimensions = $this->custom_image_header->get_header_dimensions( array( + 'width' => 1600, + 'height' => 1200, + ) ); + $this->assertEquals( $dimensions['dst_width'], 1200); + $this->assertEquals( $dimensions['dst_height'], 230); + + } + + function test_header_image_has_correct_dimensions_with_fixed() { + global $_wp_theme_features; + + unset( $_wp_theme_features['custom-header'][0]['max-width'] ); + $_wp_theme_features['custom-header'][0]['width'] = 1200; + $_wp_theme_features['custom-header'][0]['height'] = 230; + $_wp_theme_features['custom-header'][0]['flex-width'] = false; + $_wp_theme_features['custom-header'][0]['flex-height'] = false; + + $dimensions = $this->custom_image_header->get_header_dimensions( array( + 'width' => 1600, + 'height' => 1200, + ) ); + $this->assertEquals( $dimensions['dst_width'], 1200); + $this->assertEquals( $dimensions['dst_height'], 230); + + } + + function test_header_image_has_correct_dimensions_with_flex_height() { + global $_wp_theme_features; + + unset( $_wp_theme_features['custom-header'][0]['max-width'] ); + $_wp_theme_features['custom-header'][0]['width'] = 1200; + $_wp_theme_features['custom-header'][0]['height'] = 230; + $_wp_theme_features['custom-header'][0]['flex-width'] = false; + $_wp_theme_features['custom-header'][0]['flex-height'] = true; + + $dimensions = $this->custom_image_header->get_header_dimensions( array( + 'width' => 1600, + 'height' => 1200, + ) ); + $this->assertEquals( $dimensions['dst_width'], 1200); + $this->assertEquals( $dimensions['dst_height'], 900); + + } + + function test_header_image_has_correct_dimensions_with_flex_width() { + global $_wp_theme_features; + + unset( $_wp_theme_features['custom-header'][0]['max-width'] ); + $_wp_theme_features['custom-header'][0]['width'] = 1200; + $_wp_theme_features['custom-header'][0]['height'] = 230; + $_wp_theme_features['custom-header'][0]['flex-width'] = true; + $_wp_theme_features['custom-header'][0]['flex-height'] = false; + + $dimensions = $this->custom_image_header->get_header_dimensions( array( + 'width' => 1600, + 'height' => 1200, + ) ); + $this->assertEquals( $dimensions['dst_width'], 1500); // max width + $this->assertEquals( $dimensions['dst_height'], 230); + + } + + function test_header_image_has_correct_dimensions_with_flex_width_and_height() { + global $_wp_theme_features; + + $_wp_theme_features['custom-header'][0]['max-width'] = 1800; + $_wp_theme_features['custom-header'][0]['width'] = 1200; + $_wp_theme_features['custom-header'][0]['height'] = 230; + $_wp_theme_features['custom-header'][0]['flex-width'] = true; + $_wp_theme_features['custom-header'][0]['flex-height'] = true; + + $dimensions = $this->custom_image_header->get_header_dimensions( array( + 'width' => 1600, + 'height' => 1200, + ) ); + $this->assertEquals( $dimensions['dst_width'], 1600); + $this->assertEquals( $dimensions['dst_height'], 1200); + + } + + function test_create_attachment_object() { + global $custom_image_header; + + $id = wp_insert_attachment( array( + 'post_status' => 'publish', + 'post_title' => 'foo.png', + 'post_type' => 'post', + 'guid' => 'http://localhost/foo.png' + ) ); + + $cropped = 'http://localhost/foo-cropped.png'; + + $object = $this->custom_image_header->create_attachment_object( $cropped, $id ); + $this->assertEquals( $object['post_title'], 'foo-cropped.png' ); + $this->assertEquals( $object['guid'], $cropped ); + $this->assertEquals( $object['context'], 'custom-header' ); + $this->assertEquals( $object['post_mime_type'], 'image/jpeg' ); + $this->assertEquals( $object['post_content'], $cropped ); + } + + function test_insert_cropped_attachment() { + global $custom_image_header; + + $id = wp_insert_attachment( array( + 'post_status' => 'publish', + 'post_title' => 'foo.png', + 'post_type' => 'post', + 'guid' => 'http://localhost/foo.png' + ) ); + + $cropped = 'http://localhost/foo-cropped.png'; + $object = $this->custom_image_header->create_attachment_object( $cropped, $id ); + + $cropped_id = $this->custom_image_header->insert_attachment( $object, $cropped ); + + $this->assertInternalType( 'int', $cropped_id ); + $this->assertGreaterThan( 0, $cropped_id ); + } + +} diff --git a/tests/qunit/fixtures/customize-header.js b/tests/qunit/fixtures/customize-header.js new file mode 100644 index 0000000000..4f164754bc --- /dev/null +++ b/tests/qunit/fixtures/customize-header.js @@ -0,0 +1,46 @@ +window.wp = window.wp || {}; +window.wp.customize = window.wp.customize || { get: function(){} }; +window._wpCustomizeHeader = {}; +window._wpCustomizeHeader.uploads = { + 'cropped-abstract_00601126.jpg': { + 'attachment_id': 1, + 'url': 'http://dev.local/2013/11/cropped-abstract_00601126.jpg', + 'thumbnail_url': 'http://dev.local/2013/11/cropped-abstract_00601126.jpg', + 'width': 1600, + 'height': 230, + 'timestamp': 1385045565 + }, + 'cropped-cropped-miniature-golden-retriever-puppies-for-sale01127.jpg': { + 'attachment_id': 2, + 'url': 'http://dev.local/2013/11/cropped-cropped-miniature-golden-retriever-puppies-for-sale01127.jpg', + 'thumbnail_url': 'http://dev.local/2013/11/cropped-cropped-miniature-golden-retriever-puppies-for-sale01127.jpg', + 'width': 1600, + 'height': 230, + 'timestamp': 1385045566 + }, + 'cropped-tumblr_m20paq9cjn1qbkdcro1_5003.png': { + 'attachment_id': 3, + 'url': 'http://dev.local/2013/11/cropped-tumblr_m20paq9cjn1qbkdcro1_5003.png', + 'thumbnail_url': 'http://dev.local/2013/11/cropped-tumblr_m20paq9cjn1qbkdcro1_5003.png', + 'width': 1600, + 'height': 230, + 'timestamp': 1385045567 + } +}; +window._wpCustomizeHeader.defaults = { + 'circle': { + 'url': 'https://dev.local/wp-content/themes/pub/twentythirteen/images/headers/circle.png', + 'thumbnail_url': 'https://dev.local/wp-content/themes/pub/twentythirteen/images/headers/circle-thumbnail.png', + 'description': 'Circle' + }, + 'diamond': { + 'url': 'https://dev.local/wp-content/themes/pub/twentythirteen/images/headers/diamond.png', + 'thumbnail_url': 'https://dev.local/wp-content/themes/pub/twentythirteen/images/headers/diamond-thumbnail.png', + 'description': 'Diamond' + }, + 'star': { + 'url': 'https://dev.local/wp-content/themes/pub/twentythirteen/images/headers/star.png', + 'thumbnail_url': 'https://dev.local/wp-content/themes/pub/twentythirteen/images/headers/star-thumbnail.png', + 'description': 'Star' + } +}; diff --git a/tests/qunit/index.html b/tests/qunit/index.html index 92a2d75ece..c5afd52226 100644 --- a/tests/qunit/index.html +++ b/tests/qunit/index.html @@ -6,20 +6,14 @@ + - - - - - - - - - + +
@@ -27,8 +21,20 @@

    -
    +
    + +

    TinyMCE tests

    + + + + + + + + + +
    diff --git a/tests/qunit/vendor/sinon-qunit-1.0.0.js b/tests/qunit/vendor/sinon-qunit.js similarity index 100% rename from tests/qunit/vendor/sinon-qunit-1.0.0.js rename to tests/qunit/vendor/sinon-qunit.js diff --git a/tests/qunit/vendor/sinon-1.8.2.js b/tests/qunit/vendor/sinon.js similarity index 100% rename from tests/qunit/vendor/sinon-1.8.2.js rename to tests/qunit/vendor/sinon.js diff --git a/tests/qunit/wp-admin/js/customize-header.js b/tests/qunit/wp-admin/js/customize-header.js new file mode 100644 index 0000000000..ba2895f47e --- /dev/null +++ b/tests/qunit/wp-admin/js/customize-header.js @@ -0,0 +1,108 @@ +/* global wp, sinon */ + +jQuery( function() { + module('Custom Header: ChoiceList', { + setup: function() { + wp.customize.HeaderTool.currentHeader = new wp.customize.HeaderTool.ImageModel(); + this.apiStub = sinon.stub(wp.customize, 'get').returns('foo'); + this.choiceList = new wp.customize.HeaderTool.ChoiceList(); + }, + teardown: function() { + this.apiStub.restore(); + } + }); + + test('should parse _wpCustomizeHeader.uploads into itself', function() { + equal(this.choiceList.length, 4); + }); + + test('should sort by newest first', function() { + equal(this.choiceList.at(2).get('header').attachment_id, 1); + equal(this.choiceList.first().get('header').attachment_id, 3); + }); + + module('Custom Header: DefaultsList', { + setup: function() { + wp.customize.HeaderTool.currentHeader = new wp.customize.HeaderTool.ImageModel(); + this.apiStub = sinon.stub(wp.customize, 'get').returns('foo'); + this.choiceList = new wp.customize.HeaderTool.DefaultsList(); + }, + teardown: function() { + this.apiStub.restore(); + } + }); + + test('it should parse _wpCustomizeHeader.defaults into itself', function() { + equal(this.choiceList.length, 4); + }); + + test('it parses the default image names', function() { + equal(this.choiceList.first().get('header').defaultName, 'circle'); + equal(this.choiceList.at(2).get('header').defaultName, 'star'); + }); + + module('Custom Header: HeaderImage shouldBeCropped()', { + setup: function() { + wp.customize.HeaderTool.currentHeader = new wp.customize.HeaderTool.ImageModel(); + this.model = new wp.customize.HeaderTool.ImageModel(); + this.model.set({ + themeWidth: 1000, + themeHeight: 200 + }); + } + }); + + test('should not be cropped when the theme does not support flex width or height and the image has the same dimensions of the theme image', function() { + this.model.set({ + themeFlexWidth: false, + themeFlexHeight: false, + imageWidth: 1000, + imageHeight: 200 + }); + + equal(this.model.shouldBeCropped(), false); + }); + + test('should be cropped when the image has the same dimensions of the theme image', function() { + this.model.set({ + themeFlexWidth: false, + themeFlexHeight: false, + imageWidth: 2000, + imageHeight: 400 + }); + + equal(this.model.shouldBeCropped(), true); + }); + + test('should not be cropped when the theme only supports flex width and the image has the same height as the theme image', function() { + this.model.set({ + themeFlexWidth: true, + themeFlexHeight: false, + imageWidth: 4000, + imageHeight: 200 + }); + + equal(this.model.shouldBeCropped(), false); + }); + + test('should not be cropped when the theme only supports flex height and the image has the same width as the theme image', function() { + this.model.set({ + themeFlexWidth: false, + themeFlexHeight: true, + imageWidth: 1000, + imageHeight: 600 + }); + + equal(this.model.shouldBeCropped(), false); + }); + + test('should not be cropped when the theme supports flex height AND width', function() { + this.model.set({ + themeFlexWidth: true, + themeFlexHeight: true, + imageWidth: 10000, + imageHeight: 8600 + }); + equal(this.model.shouldBeCropped(), false); + }); +});