jQuery: Element is not clicked during test execution?

describe('When a user selects a single-response Hotspot response', function () {

        it('Then should highlight the selection', function () {
            utils.clickHotspotElementAtIndex(view, 0, function() {
            });
            expect(view.$('.lrn_selected')[0]).toExist();
        });

--------utils helper methods are defined below----------

const utils = _.extend({}, baseQuestionHelper.utils, {
        isReactiveViews: baseQuestionHelper.utils.isReactiveViews(hotspotBundle, 'hotspot'),
        getHotspotElementAtIndex: function (view, index) {
            return view.$('polygon').eq(index).get(0);
        },
        clickHotspotElementAtIndex: function (view, index, callback) {
            syn.click(utils.getHotspotElementAtIndex(view, index), null, callback);
            console.log('clicked on a hotspot');
        }

My jasmine test case is written as above, its expected test flow is simple:

• click on a Hotspot element at index 0
• when this Hotspot element is clicked, it will have a new class lrn_selected assigned.
• Verify this clicked Hotspot element has its class name as lrn_selected

When executed, I did get this debugging console log clicked on a hotspot. But, this script will fail with the following error message:

• Uncaught Expected undefined to exist. which suggests the hotspot element is not clicked.

Why was it not clicked?