PhantomJS lädt keine CSS Styles

Question

Hallo ich benutze PhantomJS v 2.1.1 via WebDriver in meinen Django App Tests. Aber vom Screenshot in einem problematischen Test wird CSS nicht geladen.

Ich muss testen, dass es einige Schaltflächen im Bootrap-Modal gibt, aber es wird überhaupt nicht angezeigt.

Browser init in Testaufbau:

self.browser = webdriver.PhantomJS(executable_path=settings.PHANTOMJS_PATH) 
self.browser.set_window_size(1920, 1080) 

Und Testcode es sich von selbst:

self.browser.get(self.live_server_url + "/accounts/login/") 
self.browser.find_element_by_name("login").clear() 
self.browser.find_element_by_name("login").send_keys(user.email) 
self.browser.find_element_by_name("password").clear() 
self.browser.find_element_by_name("password").send_keys(password) 
self.browser.find_element_by_id("submit").click() 
self.browser.find_element_by_id("logout").click() 
self.browser.implicitly_wait(10) 
self.assertEqual("Ano", self.browser.find_element_by_xpath("/html/body/div[4]/div/div/div[3]/button[2]").text) 
self.assertEqual("Ne", self.browser.find_element_by_css_selector("div.modal-footer").text) 

Schließlich hier ist ein Teil der HTML-Seite, die erwarteten modal produzieren:

<li> 
    <a href="#" id="logout" style="color: #ffffff">       
    <span class="glyphicon glyphicon-log-out"></span> 
    </a>      
</li> 

$(document).ready(function() { 

     $("#logout").on("click", function (e) { 
      e.preventDefault(); 
      bootbox.dialog({ 
       message: '<div class="row"> ' + 
       '<div class="col-md-12"> ' + 
       '<form class="form-horizontal" id="confirm-logout" method="post" action="/accounts/logout/"> ' + 
       "<input type='hidden' name='csrfmiddlewaretoken' value='lmXDBtPw6wSDMClUEIKOxzd8fvc3KCFL' />" + 
       '<div class="form-group"> ' + 
       '<div class="col-md-8"> ' + 
       '<div class="checkbox">' + 
       '<label>' + 
       '<input type="checkbox" ' + 
       'value="no-dialog" name="logout-confirm"> Zobrazovat tento dialog' + 
       '</label>' + 
       '</div>' + 
       '</div> ' + 
       '</div> </div>' + 
       '</form> </div> </div>', 
       title: "Odhlásit", 
       buttons: { 
        danger: { 
         label: "Ne", 
         className: "btn-danger", 
         callback: function() { 
          bootbox.hideAll() 
         } 
        }, 
        main: { 
         label: "Ano", 
         className: "btn-primary", 
         callback: function() { 
          $("#confirm-logout").submit(); 
         } 
        } 
       } 
      }); 
     }); 
     .... 
} 

Alle CSS- und JS-Dateien werden von django dev-server geladen. Sie befinden sich in statischen Verzeichnissen. Hier ist ein Teil von HTML-Kopf:

<link rel="icon" href="/static/img/favicon.ico"> 
<link rel="stylesheet" href="/static/css/base_style.css"> 
<link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css"> 
<link rel="stylesheet" href="/static/bootstrap/css/bootstrap-theme.min.css"> 
<link rel="stylesheet" href="/static/pizza-master/css/pizza.css"> 
<link rel="stylesheet" href="/static/css/profile_style.css"> 
<script src="/static/scripts/jquery_1_11.min.js"></script> 
<script src="/static/scripts/bootbox.min.js"></script> 
<script src="/static/scripts/jquery.confirm.js"></script> 
<script src="/static/bootstrap/js/bootstrap.min.js"></script> 
<script src="/static/bootstrap/js/npm.js"></script> 
<script src="/static/pizza-master/js/vendor/modernizr.js"></script> 

Schließlich gibt es Screenshots:

PhantomJs background is transparent

Destktop Chrome run server instead test

Answer 1

OK, so dass ich Lösung gefunden. Das Problem war überhaupt nicht mit PhantomJS verbunden. ChromeDriver verhält sich genau gleich.

Das Problem wurde durch Django-Tests verursacht, bei denen statische Dateien nicht wie bei runserver bereitgestellt wurden.

Lösung mit für mich gearbeitet wird ausgeführt:

python manage.py collectstatic 

Diese stellen sicher, dass Testserver dienen statische Dateien, wenn Ihr django Setup statische Dateien. Django static files doc