WordPress.org

Make WordPress Core

Changeset 30919


Ignore:
Timestamp:
12/16/2014 07:43:22 PM (5 years ago)
Author:
ocean90
Message:

Customizer: Add more QUnit tests to improve coverage on the new models.

Includes tests for the broken activate()/deactivate() methods, which were fixed in [30871].

props westonruter.
see #30701.

Location:
trunk/tests/qunit
Files:
1 added
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/tests/qunit/index.html

    r30716 r30919  
    2424    <div id="qunit-fixture">
    2525      <script src="fixtures/customize-header.js"></script>
     26      <script src="fixtures/customize-settings.js"></script>
    2627    </div>
    2728    <p><a href="editor">TinyMCE tests</a></p>
  • trunk/tests/qunit/wp-admin/js/customize-controls.js

    r30716 r30919  
    11/* global wp */
    22
    3 jQuery( function() {
     3jQuery( window ).load( function (){
     4    'use strict';
    45
    56    var controlId, controlLabel, controlType, controlContent, controlDescription, controlData, mockControl,
    67        mockControlInstance, controlExpectedValues, sectionId, sectionContent, sectionData, mockSection,
    78        sectionInstance, sectionExpectedValues, panelId, panelTitle, panelDescription, panelContent, panelData,
    8         mockPanel, panelExpectedValues, testCustomizerModel;
     9        mockPanel, panelExpectedValues, testCustomizerModel, settingId, settingValue, mockSetting;
    910
    1011    testCustomizerModel = function( model, expectedValues ) {
    11         var type =  expectedValues.type || '';
     12        if ( ! expectedValues.type || ! wp.customize[ expectedValues.type ] ) {
     13            throw new Error( 'Must pass value type in expectedValues.' );
     14        }
     15        var type = expectedValues.type;
     16        test( 'Model extends proper type', function () {
     17            ok( model.extended( wp.customize[ type ] ) );
     18        } );
    1219
    1320        if ( expectedValues.hasOwnProperty( 'id' ) ) {
    14             test( type + ' instance has the right id' , function () {
    15                 equal( model.id , expectedValues.id );
     21            test( type + ' instance has the right id', function () {
     22                equal( model.id, expectedValues.id );
    1623            });
    1724        }
    1825        if ( expectedValues.hasOwnProperty( 'title') ) {
    1926            test( type + ' instance has the right title.', function () {
    20                 equal( model.params.title , expectedValues.title );
     27                equal( model.params.title, expectedValues.title );
    2128            });
    2229        }
    2330        if ( expectedValues.hasOwnProperty( 'description' ) ) {
    2431            test( type + ' instance has the right description.', function () {
    25                 equal( model.params.description , expectedValues.description );
     32                equal( model.params.description, expectedValues.description );
    2633            });
    2734        }
    2835        if ( expectedValues.hasOwnProperty( 'content' ) ) {
    2936            test( type + ' instance has the right content.', function () {
    30                 equal( model.params.content , expectedValues.content );
     37                equal( model.params.content, expectedValues.content );
    3138            });
    3239        }
    3340        if ( expectedValues.hasOwnProperty( 'priority' ) ) {
    3441            test( type + ' instance has the right priority.', function () {
    35                 equal( model.priority() , expectedValues.priority );
    36             });
    37         }
    38         if ( expectedValues.textExpanded ) {
    39             test( type + ' instance is not expanded', function () {
    40                 equal( model.expanded() , false );
    41             });
    42 
    43             test( type + ' instance is expanded after calling .expanded()', function () {
     42                equal( model.priority(), expectedValues.priority );
     43            });
     44        }
     45        if ( expectedValues.hasOwnProperty( 'active' ) ) {
     46            test( type + ' instance has the right active state.', function () {
     47                equal( model.active(), expectedValues.active );
     48            });
     49        }
     50        test( type + ' can be deactivated', function () {
     51            model.activate();
     52            model.deactivate();
     53            equal( model.active(), false );
     54            model.activate();
     55            equal( model.active(), true );
     56            ok(true);
     57        });
     58
     59        if ( type === 'Panel' || type === 'Section' ) {
     60            if ( expectedValues.hasOwnProperty( 'expanded' ) ) {
     61                test( type + ' instance has the right expanded state.', function () {
     62                    equal( model.expanded(), expectedValues.expanded );
     63                } );
     64            }
     65
     66            test( type + ' instance is collapsed after calling .collapse()', function () {
     67                model.collapse();
     68                ok( ! model.expanded() );
     69            });
     70
     71            test( type + ' instance is expanded after calling .expand()', function () {
    4472                model.expand();
    4573                ok( model.expanded() );
    4674            });
    47 
    48             test( type + ' instance is collapsed after calling .collapse()', function () {
    49                 model.collapse();
    50                 equal( model.expanded() , false );
    51             });
    52         }
    53 
    54     };
    55 
    56 
    57     module( 'Customizer Control Model' );
     75        }
     76
     77    };
     78
     79    module( 'Customizer Setting in Fixture' );
     80    test( 'Setting has fixture value', function () {
     81        equal( wp.customize( 'fixture-setting' )(), 'Lorem Ipsum' );
     82    } );
     83
     84    module( 'Customizer Control in Fixture' );
     85    test( 'Control exists', function () {
     86        ok( wp.customize.control.has( 'fixture-control' ) );
     87    } );
     88    test( 'Control has the fixture setting', function () {
     89        var control = wp.customize.control( 'fixture-control' );
     90        equal( control.setting(), 'Lorem Ipsum' );
     91        equal( control.setting.id, 'fixture-setting' );
     92    } );
     93    test( 'Control has the section fixture section ID', function () {
     94        var control = wp.customize.control( 'fixture-control' );
     95        equal( control.section(), 'fixture-section' );
     96    } );
     97
     98    module( 'Customizer Section in Fixture' );
     99    test( 'Fixture section exists', function () {
     100        ok( wp.customize.section.has( 'fixture-section' ) );
     101    } );
     102    test( 'Fixture section has control among controls()', function () {
     103        var section = wp.customize.section( 'fixture-section' );
     104        equal( section.controls().length, 1 );
     105        equal( section.controls()[0].id, 'fixture-control' );
     106    } );
     107    test( 'Fixture section has control among controls()', function () {
     108        var section = wp.customize.section( 'fixture-section' );
     109        equal( section.panel(), 'fixture-panel' );
     110    } );
     111
     112    module( 'Customizer Panel in Fixture' );
     113    test( 'Fixture panel exists', function () {
     114        ok( wp.customize.panel.has( 'fixture-panel' ) );
     115    } );
     116    test( 'Fixture section has control among controls()', function () {
     117        var panel = wp.customize.panel( 'fixture-panel' );
     118        equal( panel.sections().length, 1 );
     119        equal( panel.sections()[0].id, 'fixture-section' );
     120    } );
     121    test( 'Panel is not expanded by default', function () {
     122        var panel = wp.customize.panel( 'fixture-panel' );
     123        ok( ! panel.expanded() );
     124    } );
     125    test( 'Panel is not expanded by default', function () {
     126        var panel = wp.customize.panel( 'fixture-panel' );
     127        ok( ! panel.expanded() );
     128    } );
     129    test( 'Focusing on a control will expand the panel and section', function () {
     130        var panel, section, control;
     131        panel = wp.customize.panel( 'fixture-panel' );
     132        section = wp.customize.section( 'fixture-section' );
     133        control = wp.customize.control( 'fixture-control' );
     134        ok( ! panel.expanded() );
     135        ok( ! section.expanded() );
     136        control.focus();
     137        ok( section.expanded() );
     138        ok( panel.expanded() );
     139    } );
     140
     141
     142    module( 'Dynamically-created Customizer Setting Model' );
     143    settingId = 'new_blogname';
     144    settingValue = 'Hello World';
     145
     146    test( 'Create a new setting', function () {
     147        mockSetting = wp.customize.create(
     148            settingId,
     149            settingId,
     150            settingValue,
     151            {
     152                transport: 'refresh',
     153                previewer: wp.customize.previewer
     154            }
     155        );
     156        equal( mockSetting(), settingValue );
     157        equal( mockSetting.id, settingId );
     158    } );
     159
     160    module( 'Dynamically-created Customizer Section Model' );
     161
     162    sectionId = 'mock_title_tagline';
     163    sectionContent = '<li id="accordion-section-mock_title_tagline" class="control-section accordion-section"></li>';
     164    sectionData = {
     165        content: sectionContent,
     166        active: true
     167    };
     168
     169    mockSection = new wp.customize.Section( sectionId, { params: sectionData } );
     170
     171    sectionExpectedValues = {
     172        type: 'Section',
     173        id: sectionId,
     174        content: sectionContent,
     175        priority: 100,
     176        active: true // @todo This should default to true
     177    };
     178
     179    testCustomizerModel( mockSection, sectionExpectedValues );
     180
     181    test( 'Section has been embedded', function () {
     182        equal( mockSection.deferred.embedded.state(), 'resolved' );
     183    } );
     184
     185    wp.customize.section.add( sectionId, mockSection );
     186
     187    test( 'Section instance added to the wp.customize.section object', function () {
     188        ok( wp.customize.section.has( sectionId ) );
     189    });
     190
     191    sectionInstance = wp.customize.section( sectionId );
     192
     193    test( 'Section instance has right content when accessed from wp.customize.section()', function () {
     194        equal( sectionInstance.params.content, sectionContent );
     195    });
     196
     197    test( 'Section instance has no children yet', function () {
     198        equal( sectionInstance.controls().length, 0 );
     199    });
     200
     201    module( 'Dynamically-created Customizer Control Model' );
    58202
    59203    controlId = 'new_blogname';
     
    64208
    65209    controlData = {
    66         content : controlContent,
    67         description : controlDescription,
    68         label : controlLabel,
    69         settings : { 'default' : 'blogname' },
    70         type : controlType
    71     };
    72 
    73     mockControl = new wp.customize.Control( controlId , {
    74         params : controlData,
    75         previewer : wp.customize.previewer
     210        content: controlContent,
     211        description: controlDescription,
     212        label: controlLabel,
     213        settings: { 'default': 'new_blogname' },
     214        type: controlType,
     215        active: true // @todo This should default to true
     216    };
     217
     218    mockControl = new wp.customize.Control( controlId, {
     219        params: controlData,
     220        previewer: wp.customize.previewer
    76221    });
    77222
    78223    controlExpectedValues = {
    79         type : 'Control',
    80         content : controlContent,
    81         descrption : controlDescription,
    82         label : controlLabel,
    83         id : controlId,
    84         priority : 10,
    85         textExpanded : false
    86     };
    87 
    88     testCustomizerModel( mockControl , controlExpectedValues );
     224        type: 'Control',
     225        content: controlContent,
     226        description: controlDescription,
     227        label: controlLabel,
     228        id: controlId,
     229        priority: 10
     230    };
     231
     232    testCustomizerModel( mockControl, controlExpectedValues );
    89233
    90234    test( 'Control instance does not yet belong to a section.', function () {
    91         equal( mockControl.section() , undefined );
    92     });
     235        equal( mockControl.section(), undefined );
     236    });
     237    test( 'Control has not been embedded yet', function () {
     238        equal( mockControl.deferred.embedded.state(), 'pending' );
     239    } );
    93240
    94241    test( 'Control instance has the right selector.', function () {
    95         equal( mockControl.selector , '#customize-control-new_blogname' );
    96     });
    97 
    98     wp.customize.control.add( controlId , mockControl );
     242        equal( mockControl.selector, '#customize-control-new_blogname' );
     243    });
     244
     245    wp.customize.control.add( controlId, mockControl );
    99246
    100247    test( 'Control instance was added to the control class.', function () {
     
    105252
    106253    test( 'Control instance has the right id when accessed from api.control().', function () {
    107         equal( mockControlInstance.id , controlId );
    108     });
    109 
    110 
    111     module( 'Customizer Section Model' );
    112 
    113     sectionId = 'mock_title_tagline';
    114     sectionContent = '<li id="accordion-section-title_tagline" class="control-section accordion-section"></li>';
    115     sectionData = {
    116         content : sectionContent
    117     };
    118 
    119     mockSection = new wp.customize.Section( sectionId , { params : sectionData } );
    120 
    121     sectionExpectedValues = {
    122         type : 'Section',
    123         id : sectionId,
    124         content : sectionContent,
    125         priority : 100,
    126         testExpanded : true
    127     };
    128 
    129     testCustomizerModel( mockSection , sectionExpectedValues );
    130 
    131     wp.customize.section.add( sectionId , mockSection );
    132 
    133     test( 'Section instance added to the wp.customize.section object', function () {
    134         ok( wp.customize.section.has( sectionId ) );
    135     });
    136 
    137     sectionInstance = wp.customize.section( sectionId );
    138 
    139     test( 'Section instance has right content when accessed from wp.customize.section()', function () {
    140         equal( sectionInstance.params.content , sectionContent );
    141     });
    142 
    143 
    144     module( 'Customizer Panel Model' );
     254        equal( mockControlInstance.id, controlId );
     255    });
     256
     257    test( 'Control section can be set as expected', function () {
     258        mockControl.section( mockSection.id );
     259        equal( mockControl.section(), mockSection.id );
     260    });
     261    test( 'Associating a control with a section allows it to be embedded', function () {
     262        equal( mockControl.deferred.embedded.state(), 'resolved' );
     263    });
     264
     265    test( 'Control is now available on section.controls()', function () {
     266        equal( sectionInstance.controls().length, 1 );
     267        equal( sectionInstance.controls()[0], mockControl );
     268    });
     269
     270    module( 'Dynamically-created Customizer Panel Model' );
    145271
    146272    panelId = 'mockPanelId';
     
    149275    panelContent = '<li id="accordion-panel-widgets" class="control-section control-panel accordion-section">';
    150276    panelData = {
    151         content : panelContent,
    152         title : panelTitle,
    153         description : panelDescription
    154     };
    155 
    156     mockPanel = new wp.customize.Panel( panelId , { params : panelData } );
     277        content: panelContent,
     278        title: panelTitle,
     279        description: panelDescription,
     280        active: true // @todo This should default to true
     281    };
     282
     283    mockPanel = new wp.customize.Panel( panelId, { params: panelData } );
    157284
    158285    panelExpectedValues = {
    159         type : 'Panel',
    160         id : panelId,
    161         title : panelTitle ,
    162         description : panelDescription,
    163         content : panelContent,
    164         priority : 100,
    165         testExpanded : true
    166     };
    167 
    168     testCustomizerModel( mockPanel , panelExpectedValues );
     286        type: 'Panel',
     287        id: panelId,
     288        title: panelTitle,
     289        description: panelDescription,
     290        content: panelContent,
     291        priority: 100,
     292        active: true
     293    };
     294
     295    testCustomizerModel( mockPanel, panelExpectedValues );
    169296
    170297    test( 'Panel instance is not contextuallyActive', function () {
    171         equal( mockPanel.isContextuallyActive() , false );
     298        equal( mockPanel.isContextuallyActive(), false );
    172299    });
    173300});
Note: See TracChangeset for help on using the changeset viewer.