Javascript Type Error, is not a function

Question

I've got abit of a strange problem, that I just can't seem to solve! It's part of a big framework I'm writing, but I've wrote some test code which has the same problem. See the following:

!function ($, window, undefined) {

    // BASE FUNCTION
    var test = function (selector, context) {
        return new test.fn.init(selector, context);
    };

    // SELECTOR FUNCTIONS
    test.fn = {
        selector:   undefined,
        init:       function (selector, context) {
            // Use jQuery to build selector object
            this.selector = $(selector, context);
            return this;
        },

        // Create a popup dialog
        popup:      function (options) {
            this.selector.dialog();
        }
    },

    // Expose Carbon to the global object
    window.test     = test;

}(window.jQuery, window);

Now when I use the following:

test('#popupLink').popup();

I get "TypeError: test("#popupLink").popup is not a function". I know it's partly working, as I can do use standard jQuery functions if I do something like:

test('#popupLink').selector.hide();

Any help would be greatly appreciated, as I'm having a mental block right now. Thanks in advance! :)

Update

I've used console.log to view the returned object, and it only has the selector element in, which makes sense as I didn't use prototype. How can I fix that?

Answer 1

(function ($, window) {
    // BASE FUNCTION
    var test = function (selector, context) {
        return new test.fn.init(selector, context);
    };

    // SELECTOR FUNCTIONS
    test.fn = test.prototype = {
        constructor: test,
        init: function (selector, context) {
            // Use jQuery to build selector object
            this.selector = $(selector, context);
            return this;
        },

        // Create a popup dialog
        popup: function (options) {
            console.log('popup');
            return this;
        }
    };

    // Expose test to the global object
    window.test = test;
}(window.jQuery, window));

test.fn.init.prototype = test.fn;

You missed the constructor and the prototype chain on the created instances of test.