Testen ein click-Ereignis mit Jasmin fügt ein Stylesheet in den Kopf

jQuery

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

Jasmin

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");
});
});

Ich bin neu auf Jasmin und der test derzeit nicht. Ich bin nicht sicher wenn es ist der Scheinwerfer, das trigger-Ereignis oder etwas völlig anderes.

InformationsquelleAutor coreballs | 2012-05-30

  1. 7

    Ich denke, die gewählte Antwort (auch wenn es durch die OP!) ist irreführend und falsch. Ich bin mir nicht sicher, warum, es wäre "schlechter form" um die Wirkung zu testen, dass ein Stück JavaScript auf einige gezielte HTML. Oft ist das die einzige Ausgabe, die Sie verwenden können, um zu überprüfen, ob eine Methode funktioniert.

    Den test verwendet, als ein Beispiel, muss nicht wirklich etwas beweisen: natürlich klicken Sie ausgelöst wurde, wird Sie nur ausgelöst! Was möchten Sie tun, etwas beweisen, folgt daraus, klicken Sie auf, z.B. eine änderung in einem DOM oder einer anderen Datenstruktur, wurde die ursprüngliche (IMO richtig) Instinkt.

    Was Sie wollen, ist auf eine asynchrone test warten, bis eine änderung in der DOM-und geben dann, ähnlich wie bei der Ruby-Bibliothek Capybara funktioniert:

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

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

    InformationsquelleAutor method

  2. 1

    Forschung hat gezeigt, es ist in schlechter form, um zu testen, Seite bestimmte Elemente.

    Meinem aktuellen test (vorbei) ist wie folgt:

    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'));
});
});
    "Die Forschung hat gezeigt," => Zitat benötigt.

    InformationsquelleAutor coreballs

  3. 0

    theme_switcher ist die id von deinem link. toContain nimmt einen Selektor, d.h. Sie sollte schriftlich toContain('#theme_switcher').

    Auch sicher, dass Sie anfügen, die in der sandbox und auch die überprüfung der Leiter der sandbox, nicht das Dokument.

    EDIT:

    Ich nehme an, Sie verwenden jasmine-jquery

    Ich war nicht bewusst, dass toContain() könnte ein CSS-Selektor als argument. Haben Sie eine Referenz, die Sie verbinden können?
    Ich war neugierig, so hab ich etwas Suche. Unter der Haube toContain() Anrufe jasmine.Env.prototype.contains_() die hier. Ich sehe nichts, das darauf hindeuten würde, dass Sie es akzeptieren einen CSS-Selektor, aber ich würde gerne als falsch erwiesen!
    Wie kontrollieren Sie den Kopf der sandbox? Ich denke, dass die einzige Leiter, die show wird in der Prüfung ist das Dokument. sandbox(); zurück <div id="sandbox"></div>
    annehmen Sie jasmine-jquery-die Total Sinn machen, in deinem Fall. Haben Sie einen Blick auf den link, werden Sie feststellen, toContain nimmt einem jQuery-Selektor. Haben Sie vielleicht eine Leiter in Ihre html-außerhalb der sandbox. $('head') wieder die beiden.

    InformationsquelleAutor ggozad

Schreibe einen Kommentar