2012-05-30 9 views
5

jQueryपरीक्षण है कि सिर

$(".theme-picker").click(function() { 
     $('head').append('<link rel="stylesheet" href="" type="text/css" media="screen" id="theme_switcher"/>'); 
}); 

जैस्मीन

describe("style.switcher", function() { 

beforeEach(function() { 
    jasmine.getFixtures().set(
     '<head></head>' + 
     '<div class="switcher">' + 
      '<a class="theme-picker" title="theme-picker"></a>' + 
      '<a class="folder-picker" title="folder-picker"></a>' + 
      '<a class="font-picker" title="font-picker"></a>' + 
      '<a class="color-picker" title="color-picker"></a>' + 
     '</div>'); 
    }); 

it("loads themes switcher link in head", function() { 
    $('.theme-picker').trigger('click'); 
    expect($('head')).toContain("theme_switcher"); 
}); 
}); 

मैं चमेली के लिए नया हूँ और परीक्षण वर्तमान में विफल हो रहा है के लिए एक शैली पत्रक संलग्न कर देता है जैस्मीन के साथ एक क्लिक करें घटना। मुझे यकीन नहीं है कि यह स्थिरता, ट्रिगर घटना या पूरी तरह से कुछ और है।

उत्तर

6

मैं चुना जवाब लगता है भ्रामक और गलत है (भले ही यह ओपी द्वारा है!)। मुझे यकीन नहीं है कि जावास्क्रिप्ट का एक टुकड़ा कुछ लक्षित एचटीएमएल पर इस प्रभाव का परीक्षण करने के लिए "खराब फॉर्म" क्यों होगा। अक्सर यह एकमात्र आउटपुट है जिसका उपयोग आप यह सत्यापित करने के लिए कर सकते हैं कि कोई विधि काम करता है या नहीं।

उदाहरण के रूप में उपयोग किया जाने वाला परीक्षण वास्तव में कुछ भी साबित नहीं करता है: बेशक क्लिक ट्रिगर किया गया था, आपने बस इसे ट्रिगर किया था! आप जो करना चाहते हैं वह उस क्लिक से कुछ ऐसा साबित होता है, उदा। एक डीओएम या अन्य डेटा संरचना में परिवर्तन, जो मूल (आईएमओ सही) वृत्ति था।

तुम क्या चाहते डोम में एक परिवर्तन के लिए प्रतीक्षा करने के लिए और फिर छोड़ देना एक अतुल्यकालिक परीक्षण (https://github.com/pivotal/jasmine/wiki/Asynchronous-specs) का उपयोग करने के लिए है, जिस तरह से करने के लिए इसी तरह की रूबी पुस्तकालय Capybara (https://github.com/jnicklas/capybara/) काम करता है:

it('loads themes switcher link in head', function() { 
    $('.theme-picker').trigger('click'); 

    waitsFor(function() { 
    return $('head').contains('theme_switcher'); 
    }, 'theme switcher never loaded', 10000); 
}); 
0

theme_switcher आपके लिंक की आईडी है। toContain एक चयनकर्ता लेता है, यानी आपको toContain('#theme_switcher') लिखना चाहिए।

यह भी सुनिश्चित करें कि आप सैंडबॉक्स में संलग्न हैं और सैंडबॉक्स के सिर की जांच भी कर रहे हैं, न कि आपके दस्तावेज़ के।

संपादित करें:

मैं आप का उपयोग jasmine-jquery

+0

मैं था इस बात से अवगत नहीं है कि 'toContain() 'एक सीएसएस चयनकर्ता को तर्क के रूप में ले सकता है। क्या आपके पास कोई संदर्भ है जिसे आप लिंक कर सकते हैं? –

+0

मैं इस बारे में उत्सुक था इसलिए मैंने कुछ खोज किया। हुड के तहत, 'toContain()' कॉल 'jasmine.Env.prototype.contains _() 'जो [यहां परिभाषित किया गया है] (https://github.com/pivotal/jasmine/blob/master/src/core/Env। जे एस)। मुझे कुछ भी दिखाई नहीं देता है जो इंगित करेगा कि यह एक सीएसएस चयनकर्ता स्वीकार करेगा, लेकिन मुझे गलत साबित होना अच्छा लगेगा! –

+0

आप सैंडबॉक्स के सिर की जांच कैसे करते हैं? मुझे लगता है कि परीक्षण में दिखाई देने वाला एकमात्र सिर दस्तावेज़ है। सैंडबॉक्स(); रिटर्न

coreballs

2

अनुसंधान दिखाया है यह पेज विशिष्ट तत्वों का परीक्षण करने के खराब फार्म में है मान लेते हैं।

मेरे वर्तमान परीक्षण (गुजर) इस प्रकार है:

describe("zen switcher", function() { 

beforeEach(function() { 
    loadFixtures('zen_switcher.html'); 
    spyOnEvent($('.theme-picker'), 'click'); 
}); 

it("clicks the .theme-picker", function() { 
    $('.theme-picker').click(); 
    expect('click').toHaveBeenTriggeredOn($('.theme-picker')); 
}); 
}); 
+4

"अनुसंधान दिखाया गया है" => उद्धरण वांछित। –

संबंधित मुद्दे