简体   繁体   中英

Jasmine Testing reference error

I am trying out Jasmine unit testing for the first time and applying it to as existing code, i have tried to follow the documentation on jasmine.

Below is the structure of the html file

<!doctype html>
<html>
    <head>
        <title>Jasmine Test</title>
        <link rel="stylesheet" href="bower_components/jasmine/lib/jasmine-core/jasmine.css">
    </head>
    <body>
        <script src="bower_components/jasmine/lib/jasmine-core/jasmine.js"></script>
        <script src="bower_components/jasmine/lib/jasmine-core/jasmine-html.js"></script>
        <script src="bower_components/jasmine/lib/jasmine-core/boot.js"></script>

        <!-- include source files here... -->
         <script type="text/javascript" src="signUp.js"></script>

        <!-- include spec files here... -->
        <script src="test/signUp.js"></script>
    </body>
</html>

Following is the code under my signUp.js file

var signUp = {

    usernameValid: function(validity){
        var emailValue = $('#inputEmail').val(),
            pattern = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i),
            regexVal = pattern.test(emailValue);
        if(emailValue == "" || !regexVal){
            $('.inputEmail').removeClass("has-success").addClass("has-error");
        }else{
            validity = true
            $('.inputEmail').removeClass("has-error").addClass("has-success");
        }

        return validity;
    },

    passwordValidity: function(validity){
        var passwordVal = $('#inputPassword').val();

        if(passwordVal == ""){
            $('.inputPassword').addClass("has-error").removeClass("has-success");
        }else if(passwordVal.length < 6){
            $('.inputPassword').addClass("has-error").removeClass("has-success");
            $('#inputPassword').attr("placeholder", "Password must be at least 6 characters");
        }else{
            validity = true;
            $('.inputPassword').addClass("has-success").removeClass("has-error");
        }

        return validity;
    },

    cnfrmPassword: function(validity){
        var confirmPassVal = $('#inputConfirmPassword').val(),
            passwordVal = $('#inputPassword').val();

        if(confirmPassVal == "" || passwordVal != confirmPassVal){
            $('.inputConfirmPassword').addClass("has-error").removeClass("has-success");
            $('#inputConfirmPassword').attr("placeholder", "Password did not match");
        }else{
            validity = true;
            $('.inputConfirmPassword').addClass("has-success").removeClass("has-error");
        }

        return validity;
    },

    nameValidity: function(validity){
        var firstName = $('#inputFirstName').val(),
            pattern = new RegExp(/^[a-zA-Z]*$/),
            regexVal = pattern.test(firstName);

        if(firstName == "" || !regexVal){
            $('.inputFirstName').addClass("has-error").removeClass("has-success");
        }else if(!regexVal){
            $('.inputFirstName').addClass("has-error").removeClass("has-success");
            $('#inputFirstName').attr("placeholder", "Only letters for this field");
        }else{
            validity = true;
            $('.inputFirstName').addClass("has-success").removeClass("has-error");
        }

        return validity;
    },

    lastNameField: function(){
        var lastName = $('#inputLastName').val();

        if(lastName){
            $('.inputLastName').addClass("has-success");
        }
    },

    checkDOB: function(validity){
        var dateOfBirth = $('#inputDOB').val(),
            today = new Date(),
            birthdate = new Date(dateOfBirth),
            age = today.getFullYear() - birthdate.getFullYear(),
            month = today.getMonth() - birthdate.getMonth();

        if (month < 0 || (month == 0 && today.getDate() < birthDate.getDate())) {
            age--;
        }

        if(dateOfBirth == "" || (age < 14 || age > 150)){
            $('.inputDOB').addClass("has-error").removeClass("has-success");
        }else{
            validity = true;
            $('.inputDOB').addClass("has-success").removeClass("has-error");
        }

        return validity;
    },

    convertDate: function(dateOfBirth){
        var date = new Date(dateOfBirth);
        return date.toISOString();
    },

    dateType: function(){
        if(!Modernizr.inputtypes.date){
            $('#inputDOB').datepicker();
        }
    }

$(document).ready(function(){
    signUp.usernameValid();
    //any other functionality
}

Under my test/signUp.js file, i have the following

describe("SignUp fields", function(){
    it("should expect UserName", function(){
        expect(signUp.usernameValid()).toBeDefined();
    });
});

Upon running the above i seem to get the following error

TypeError: Cannot read property 'usernameValid' of undefined

and also on inspecting the "signUp" object it throws a Reference Error

EDIT: Is there any special kind of support required for jquery with jasmine?

So after bit of a research i noticed that i was missing out on the jquery file. I included the jquery source extension from the cdn, but i still noticed the same error then i switched over to the local version of jquery and it worked. Also i had to include modernizer library as i am making use of it in my main js file.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM