Nützliche DevTools-Funktionen für Tester

Hallo zusammen! Mein Name ist Misha, ich arbeite in der Position eines manuellen Testers oder einer manuellen Qualitätssicherung - wie es für jeden bequem ist. Aufgrund der Tatsache, dass manuelle Tests in meiner Arbeit vorherrschen, stoße ich häufig auf die Entwicklerkonsole im Browser (ich denke, das entspricht 99,9% der Webtester). 

Es gibt viele Quellen im Internet, in denen Sie Informationen zu DevTools finden, sowohl für Entwickler als auch für Tester. Natürlich ist der Inhalt solcher Artikel je nach Schwerpunkt sehr unterschiedlich. Nachdem ich eine große Menge solchen Materials studiert hatte und festgestellt hatte, dass uns (Testern) Informationen entzogen werden :), entschied ich mich, in die primäre Quelle zu gehen, um die Tools des Entwicklers vollständig zu studieren. Ich ging alle Elemente des riesigen Menüs durch und schrieb ungefähr 20 Elemente für mich auf, die für Tester interessant (nützlich lesen) wären. Ich muss sofort sagen, dass ich Ihnen im Artikel nicht sagen werde, wie Sie dieses oder jenes Werkzeug verwenden sollen, da dies in den Artikeln, die jedem der Punkte beigefügt werden, ausführlich beschrieben wird. Der Zweck meiner Geschichte ist eher, genau diese von der riesigen Liste der DevTools-Funktionen zu isolierenDas wäre nützlich für QS-Spezialisten. Ich gebe nicht vor, Objektivität und vollständige Offenlegung des Themas zu sein, aber ich werde versuchen, es zu tun. 

PS: Die Reihenfolge der Elemente in der Liste gibt nicht an, wie wichtig sie sind.

1. Emulation Android und iOS, verbinden Android beim Debuggen.

   
   
   
   
   

   Es scheint mir, dass die meisten Unternehmen, die Produkte für mobile Geräte herstellen, derzeit über eine Flotte von Geräten verfügen, die für die vollständige Prüfung ihres Produkts erforderlich sind. Allerdings hält es nicht jeder für notwendig, dafür Geld auszugeben. Die Notwendigkeit, Ihr Produkt auf einem bestimmten Gerät zu testen, hängt nicht immer davon ab, ob dieses Produkt für Mobiltelefone geeignet ist oder nicht. In diesem Zusammenhang besteht die Notwendigkeit, ihre Websites auf Mobilgeräten ohne ihre physische Präsenz zu überprüfen. Der Nachteil dieses Ansatzes ist, dass die meisten dieser Emulatoren kommerziell sind.  

   
   
   
   
   

   android, . , .

   
   
   
   
   

2. User-Agent.

   
   
   
   
   

   DevTools . () . , - , . User-Agent , - . , User-Agent .

   
   
   
   
   

   

3. JS .

   
   
   
   
   

   , . JS, . , , , , , , DevTools .

   
   
   
   
   

4. CSS .

   
   
   
   
   

   , - . . , (, , ..), , , “live” .

   
   
   
   
   

   

5. CSS Javascript .

   
   
   
   
   

   , web-. , “” , , , , , .

   
   
   
   
   

   

6. debug JavaScript.

   
   
   
   
   

   , - , . , , . . , JavaScript, , , . , , , . 3 Chrome. , , , .

   
   
   
   
   

7. Chrome .

   
   
   
   
   

   DevTools ( 65 ). , CSS , . , , , , .

   
   
   
   
   

8. .

   
   
   
   
   

   DevTools, , . , 90% , , , , , , , . , , .  .

   
   
   
   
   

   

9. Network.

   
   
   
   
   

   , DevTools . , .

   
   
   
   
   

   

10. .

    
    
    
    
    

    , . , , , .

    
    
    
    
    

11. .

    
    
    
    
    

    , , . , , , , .

    
    
    
    
    

    

12. cookies applications.

    
    
    
    
    

    Cookies - , , () , , -, . (, , ).

    
    
    
    
    

: 

( ), , , , : 

• shortcuts, chrome DevTools; 

  
  
  
  
  

• ; 

  
  
  
  
  

• ; 

  
  
  
  
  

• xhr ; 

  
  
  
  
  

• ; 

  
  
  
  
  

• JavaScript ; 

  
  
  
  
  

• , network.

  
  
  
  
  

Natürlich ist DevTools nicht auf die oben beschriebene Funktionalität beschränkt. Es gibt sehr interessante Registerkarten mit den Namen Leistung und Prüfung, aber ich habe diese Informationen noch nicht geladen, da ich sie als Thema für einen separaten Artikel betrachte, wenn es im Allgemeinen interessant sein wird, diese Registerkarten in DevTools zu lesen und sich mit ihnen vertraut zu machen.

Vielen Dank für Ihre Aufmerksamkeit!