מדריך מלא לאסטרגיה של Selenium בטעינת דף

אוטומציה של דפי אינטרנט מתפתחת באופן משמעותי, ורובנו עובדים על כך. זה משהו שאנו עובדים עליו כמעט באופן קבוע, מאולפנים תרחישים רבים ונעים בין דפים אינטרנט רבים.

אבל האם אי פעם תהיתם מה קורה מתחת למכסה כשדף האינטרנט מועלה ב-Selenium WebDriver? אנו מכירים כמה פונקציות של WebDriver המשמשות לנavigate לדף אינטרנט, כמו get() ו-navigate(), אך האם הן מגדירות איך דף מועלה, או שיש פונקציות אחרות שפועלות בפקק הכוח של הדברים?

התשובה לכך היא כן! זה מוגדר על ידי משהו הנקרא אסטרגיה של טווח טעינת הדף ב-Selenium WebDriver. ה-WebDriver משתמש באסטרגיה של טווח טעינת הדף כדי לקבוע איך דף האינטרנט יועלה לפני שתמשיך עם קשה משפטים נוספים; לבצע את הפעולות הבאות.

בבלוג זה על אסטרגיה של טווח טעינת הדף ב-Selenium, נעבור על מחשבה עמוקה יותר על אסטרגיה זו וננסה להבין את הסוגים השונים שלה ואיך ניתן ליישם אותם בקוד האוטומציה.

אז בואו נתחיל!

מהי אסטרגיה של טווח טעינת הדף?

אסטרגיה של טווח טעינת הדף קובעת מתי יחשבו שהדף טעון עבור הסשן הנוכחי בכל פעם שקוד האוטומציה משתמש בדפדפן ומשתמש בשיטות get() או navigate().to(). כבסיס, Selenium WebDriver משתמש באסטרגיה של טווח טעינת הדף הסטנדרטית, שהיא NORMAL. זה אומר לחכות עד שכל הדף האינטרנט ורכיביו, כמו CSS, תמונות, מסגרות וכד', טעונים.

אם הדף לוקח יותר זמן לטעינה עקב הרכיבים שציינו לעיל (או תנודות בתנאי הרשת) ואינו חשוב לתסריט שלך, אפשר לשנות אותו לEAGER או NONE כדי להאיץ את הביצועים. ערך זה חל על כל הסשן, אז עליך לבחור בחוכמה עבור הפרויקט שלך אחרת זה עלול להוביל לנזקקות בבדיקות.

השימוש ב-Page Load Strategy הוצג כחלק מהתכונות של Selenium 4. שלא כמו בגרסאות קודמות, זה מבטל את התלות בשימוש בזמני הטרמון הברירת מחדל של הדף.

איך פועל Page Load Strategy?

כדי לקבוע האם הטעינה של הדף הושלמה או לא, Selenium משתמש במאפיין document.readyState. מאפיין document.readyState מתאר את מצב הטעינה של המסמך. כאן, "מסמך" מתייחס לכל דף אינטרנט שטוען בדפדפן.

שיטת ה-Ready State של Document נתמכת על ידי כל הדפדפנים, מה שהופך אותה לאפשרות אמינה לשימוש עם PageLoadStrategy של Selenium.

ממש כמו שיש לנו PageLoadStrategy ברירת מחדל, document.readyState הברירת מחדל של Selenium WebDriver מחכה לו הוא Complete.

מאפיין readyState של אובייקט המסמך של הדפדפן מייצג את המצב הנוכחי של תהליך הטעינת הדף. המאפיין יכול לקבל אחת מהערכים הבאים:

• loading – הדף עדיין בתהליך הטעינה.
• interactive – הדף הסתיים את הטעינה, אך משאבים משניים כמו תמונות, גליונות תצוגה ומסגרות עשויים עדיין לטעון.
• complete – הדף וכל המשאבים המשניים הסתיימו את הטעינה.

אפשר להשתמש במאפיין readyState כדי לקבוע מתי דף טעון לגמרי ומוכן להשתמש בו באמצעות JavaScript או באמצעים אחרים. לדוגמה, ב-Selenium, אפשר להשתמש במאפיין readyState כדי לקבוע מתי דף טען, והאלמנטים בדף יכולים להישתמש בפקודות Selenium.

לפני שנמשיך הלאה, בואו נבין קצת יותר על readyState של המסמך באמצעות תרגול קצר.

1. גלשו ל-האתר.
2. ברגע שהאתר טען, לחצו ימינה על העכבר -> לחצו על התבוננות -> פתחו את התוכנית וביצעו את הפקודה document.readyState.

3. כתוצאה מפקודה זו, תראו את הפלט כמושלם, שזה המצב הנוכחי של המסמך. זה אומר שכל הדף טען עם המשאבים ההכרחיים (כלומר, תמונות, CSS וכו ').

4. לאחר מכן, רענן את הדף והקשיבו שוב על הפקודה לעיל. תוכלו לראות את מצב הטעינה של המסמך ברגע זה, כמו להלן.

אם אי אפשר לראות את מצב הטעינה לאחר 4-5 התחלקות, נסו לדחוף את תנאי האינטרנט על ידי הגדרת הרשת לאפשרויות איטיות יותר. אפשר ללמוד עוד על זה דרך בלוג זה על בדיקת אתרים בתנאי רשת שונים. אנו נשתמש באותו גישה גם בהדגמה.

אז זה מראה איך document.readyState עובד בפועל. אפשר גם לבדוק את ביצועי האתר תחת תנאי רשת שונים באמצעות LT BROWSER, כלי בדיקה מותאם לניידים. LT BROWSER הוא כלי תואם שמציעה LAMBDA TEST, המאפשר לבדוק את הResponsiveness של האתר שלך על יותר מ-50 מכשירים שונים, כולל סמארפונים, טאבלטים ולפטופים. הוא גם מספק את היכולת ליצור פיתוחים מותאמים אישית, לדמות תנאי רשת שונים וליצור דוחות ביצועים באמצעות GOOGLE LIGHTHOUSE.

בואו נמשיך הלאה כדי להבין את הערכים האלה ואיך הם מותאמים לערכי PageLoadStrategy.

PageLoadStrategy <> document.readyState Mapping

הreadyState של המסמך יכול להיות אחד מהבאים:

• טוען: טעינת המסמך נמצאת בתהליך.
• אינטראקטיבי: המסמך הוטען ונבדק, אך המשאבים המשניים כמו תכנית קוד, תמונות, CSS ומסגרות עדיין נמצאות בתהליך טעינה. בנקודה זו, מופעל אירוע DOMContentLoaded.
• מושלם: המסמך וכל המשאבים המשניים הסתיימו את הטעינה. זה מצביע על הופעת האירוע טעינה.

כל PageLoadStrategy מותאם לערך document.readyState מסוים בהתבסס עליו ה-WEBDRIVER ישלים את שיטת הניווט וימשיך לבצע את הצעדים הבאים.

סוגים של אסטרגיות טעינת הדף ב-SELENIUM

ישנם בדרך כלל שלושה סוגים של אסטרגיות טעינת הדף ב-SELENIUM המשמשים באוטומציה אינטרנטית.

NORMAL (ברירת מחדל, אם לא מצוין)

זהו אסטרטגיה טעינת הדף של סלניום שגורמת לוובדריין לחכות עד שהטעינה של הדף תהיה גמורה, כלומר מתרחשת אירוע הטעינה.

אירוע הטעינה מתרחש כאשר הדף טעון, כולל המשאבים התלויים כגון CSS, JavaScript, iFrames ותמונות.

היא מחכה להורדת וניתוח התוכן ה-HTML יחד עם כל המשאבים התתיים.

EAGER

באמצעות אסטרטגיה טעינת הדף של סלניום זו, הוובדריין מחכה רק עד שהדף הראשוני טעון ומתרחש אירוע DOMContentLoaded.

בניגוד לאירוע הטעינה, אירוע DOMContentLoaded מתרחש ברגע שה-DOM טעון מבלי לחכות למשאבים נוספים כמו CSS, JavaScript, iFrames ותמונות להטות.

היא מחכה רק להורדת וניתוח התוכן ה-HTML.

NONE

באסטרטגיה טעינת הדף של סלניום זו, הוובדריין אינו נעול וממשיך עם ביצוע הבדיקות.

היא מחכה רק להורדת התוכן ה-HTML.

הדגמה: הגדרת WebDriver עם אסטרטגיות טעינת דף שונות של סלניום

עכשיו, לאחר שפיתחנו הבנה בסיסית של אסטרטגיות טעינת דף שונות של סלניום, בואו נסתכל על דוגמאות קוד כדי להבין איך זה מיושם.

כדי לעשות זאת, נכתוב תסריט בדיקות אוטומציה לתרחיש הבא.

1. צור מופע של RemoteWebDriver באמצעות רשת סלניום מבוססת הענן. לשם כך, נשתמש בפלטפורמת LambdaTest.
2. הגדר את יכולות WebDriver לספציפיות PageLoadStrategy.
3. בשלב הבא, השתמש בדרישות כדי להפעיל את הדפדפן ולנavigate כאן.
4. לשם כך, נשים לב לתקופת הזמן בה הטעינת הדף הושלמה כדי לראות איך היא משתנה עבור שיטות טעינת דף Selenium שונות תחת אותן תנאים. הבדלים בזמן טעינת הדף יעזרו לקבל בהירות רבה יותר על כל האסטרגיות.

הקמת הפרויקט

לצורך בלוג שיטת טעינת הדף Selenium זה, ישמשו פרויקט Maven המשתמש בJava ב-Eclipse IDE. אם אתה לא מעריץ של Eclipse, השתמש בכל IDE אחר שלך ובצע את אותם הצעדים. זה ישתמש ב-Selenium WebDriver ובסמכויות TestNG להפעלת אינטראקציה מופקדת עם רכיבי הדף וביצוע מקרים בדיקה. מומלץ ביותר להשתמש בגירסאות יציבות מהירות לקבלת תוצאות טובות יותר.

בואו נתחיל עכשיו.

1. השגת Eclipse או כל IDE אחר שלך.
2. צור פרויקט Maven חדש וקרא לו PageLoadStrategy.
3. בתוך התיקייה src, הוסף חבילת בדיקה ובתוכה מחלקת בדיקה וקרא לה TestPageLoadStrategy. מחלקה זו תשאיר את כל הקוד להדגמה זו.

4. עדכן את קובץ pom.xml כדי להכיל את הסמכויות העדכניות ביותר לשימוש ב-TestNG ב-Selenium, כפי שמוצג להלן, לפני שכותבים את המקרה הבדיקה האמיתי.

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi= "http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation=" http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
 <modelVersion>4.0.0</modelVersion>
 <groupId>PageLoadStrategy</groupId>
 <artifactId>PageLoadStrategy</artifactId>
 <version>0.0.1-SNAPSHOT</version>
 <build>
   <sourceDirectory>src</sourceDirectory>
   <plugins>
     <plugin>
       <artifactId>maven-compiler-plugin</artifactId>
       <version>3.8.1</version>
       <configuration>
         <release>16</release>
       </configuration>
     </plugin>
   </plugins>
 </build>
 <dependencies>
   <dependency>
       <groupId>org.seleniumhq.selenium</groupId>
       <artifactId>selenium-java</artifactId>
       <version>4.6.0</version>
   </dependency>
   <dependency>
       <groupId>org.testng</groupId>
       <artifactId>testng</artifactId>
       <version>7.7.0</version>
       <scope>test</scope>
   </dependency>
 </dependencies>
</project>

package test;


import java.net.MalformedURLException;
import java.net.URL;
import java.time.*;
import java.util.HashMap;
import org.openqa.selenium.PageLoadStrategy;
import org.openqa.selenium.chrome.ChromeOptions;
import org.openqa.selenium.remote.RemoteWebDriver;
import org.testng.annotations.Test;


public class TestPageLoadStrategy {


   public RemoteWebDriver driver = null;
   String username = "";
   String accessKey = "";
 
  ChromeOptions chromeOptions = new ChromeOptions();
   HashMap ltOptions = new HashMap();


   private void setup(String buildName) {


       chromeOptions.setPlatformName("Windows 10");
       chromeOptions.setBrowserVersion("108.0");


       ltOptions.put("project", "Page Load Strategy");
       ltOptions.put("selenium_version", "4.0.0");
       ltOptions.put("w3c", true);
       ltOptions.put("networkThrottling", "Regular 2G");
       ltOptions.put("build", buildName);
   }


   private void checkPageLoad() {
       try {
           driver = new RemoteWebDriver(
                   new URL("https://" + username + ":" + accessKey + "@hub.lambdatest.com/wd/hub"), chromeOptions);


           Instant startTime = Instant.now();
           System.out.println("Page load started at : " + startTime.toString());
           
           System.out.println("Navigating to the URL");
           driver.get("https://ecommerce-playground.lambdatest.io/");
          
           Instant endTime = Instant.now();
           System.out.println("Page load ended at : " + endTime.toString());


           Duration duration = Duration.between(startTime, endTime);
           System.out.println("Total PageLoad time : " + duration.toMillis() + " milli seconds");
       } catch (MalformedURLException e) {
           System.out.println("Invalid grid URL");
       } finally {
           driver.quit();
       }
   }


   @Test
   public void testNormalStrategy() {
       // להגדיר PageLoadStrategy = רגיל
       setup("Page Load Strategy - Normal");


       chromeOptions.setPageLoadStrategy(PageLoadStrategy.NORMAL);
       chromeOptions.setCapability("LT:Options", ltOptions);
       checkPageLoad();
   }


   @Test
   public void testEagerStrategy() {
       // להגדיר PageLoadStrategy = חרד
       setup("Page Load Strategy - Eager");
       chromeOptions.setPageLoadStrategy(PageLoadStrategy.EAGER);
       chromeOptions.setCapability("LT:Options", ltOptions);
       checkPageLoad();
   }


   @Test
   public void testNoneStrategy() {
       // להגדיר PageLoadStrategy = אפס
       setup("Page Load Strategy - None");
       chromeOptions.setPageLoadStrategy(PageLoadStrategy.NONE);
       chromeOptions.setCapability("LT:Options", ltOptions);
       checkPageLoad();
   }
}

שימוש בענן רשת Selenium משמש להגדלת ההילוך והמהירות לבדיקות אוטומציה ב-Java ומאפשר למשתמשים לבצע בדיקות מקביליות רבות ובדיקות עירבות ברובזר על מספר רב של שילובים של מערכות הפעלה ודפדפנים. 

שלב 2. כפי שצוין בשלב הקודם, מאחר שאנו משתמשים בפלטפורמת LambdaTest, עלינו לספק את שם המשתמש ומפתח הגישה של המשתמש שלנו כדי להתחבר להיכל הענן. אפשר למצוא את הפרטים הללו תחת סעיף פרופיל LambdaTest לאחר שיוצרים חשבון.

שלב 3. צור אובייקט של המחלקה ChromeOptions. מחלקה זו משמשת לשינוי תכונות שונות של נriver הכרום, שאנו נשתמש בו לביצוע. אובייקט chromeOptions זה ישמש בכל מקרה של בדיקה להגדרת PageLoadStrategy ולאחר מכן יועבר לWebDriver.

שלב 4. צור משתנה HashMap וקרא לו ltOptions. זה יגדיר תכונות שונות לביצוע ברשת הענן LambdaTest.

שלב 5. הבא הוא התקנה() הפונקציה, המשמשת להגדרת כמה תכונות בסיסיות בchromeOptions ו-ltOptions. אלה הן התכונות המשותפות של שלושת מקרי PageLoadStrategy.

כמו כן, שים לב שאנו משתמשים בתכונת networkThrottling של LambdaTest להגדרת הרשת ל-Regular 2G עם מהירות הורדה של 250 Kbps ומהירות העלאה של 50 Kbps. זה יעזור להדגים את זמן הטעינה טוב יותר בכל התרחשויות, כפי שניתן ללמוד בקטע הקודם.

השימוש בפלטפורמת LambdaTest מעניק את היתרון הזה שבו אפשר לבחור ישירות את פרטי הדפדפן ופרטי הגרסה, והיכולות שלך מיוצרות אוטומטית באמצעות יצרן יכולות LambdaTest. אתה רק צריך להוסיף אותם לקוד.

הפונקציה זו מקבלת פרמטר אחד, buildName. פרמטר זה משמש להצגת שם הבנייה.

שלב 6. הוסף פונקציה חדשה, checkPageLoad(). בלוק try, אנו כותבים את הקוד לחיבור עם RemoteWebDriver בפלטפורמת LambdaTest באמצעות התכונות המוגדרות בchromeOptions.

לאחר הקמת החיבור, נוצר עצם ממחלקת ה-Instant של חבילת Java.time כדי לאחסן ולהתעדכן בזמן ההתחלה כשאנו עומדים להשיק את הדפדפן ולהתחיל לנavigate. זה מלווה בקריאת נriver לדפדפן והשיק של אתר הבדיקה.

ברגע שהאתר נחשב טעון תלוי ב-PageLoadStrategy המוגדר, הנriver מעביר את השליטה לפקודה הבאה, שגם כן היא עצם ממחלקת Instant, כדי לקבל שוב את הזמן הנוכחי, זמן הסיום.

עד כה, הדף טעון על פי האסטרטגיה המבוקשת שלנו, ויש לנו את זמני ההתחלה והסיום. הזמן שלוקח לטעון דף אינטרנט באלפיות השנייה יכול להיות קבוע על ידי חישוב ההפרש בין שתי נקודות. המחלקה Duration, ששייכת לאותו חבילה, משמשת להשגת כך.

תבחין שזמן הטעינה זהה לכל המקרים המבוקשים שלנו עבור אסטרטגיות שונות.

A catch block is added next for the try block to handle the exception if it occurs. MalformedURLException is to catch the exception in case our RemoteWebDriver URL has invalid syntax. Once everything is done, we finally close the driver instance. To learn more about it, you can go through this blog on the most common exceptions in Selenium.

testNormalStrategy()

זהו מקרה הבדיקה להדגמת האסטרטגיה הנורמלית.

ראשית, השיטה setup() מגדירה מאפיינים בסיסיים עבור הדפדפן ומסך LambdaTest. לאחר מכן, הערך עבור PageLoadStrategy מוגדר כ-NORMAL כאן ב-chromeOptions, ולאחר מכן מגדירים יתר היכולות.

לבסוף, מתקיים קריאת שיטת checkPageLoad() לטעינת האתר ולתיעוד זמן הטעינה, שנשווה עבור כל אסטרטגיה בקטע הביצוע.

testEagerStrategy()

זהו מקרה הבדיקה להדגמת האסטרטגיה הנחוצה.

כל השלבים, במקרה זה, דומים לקודמו. ההבדל היחיד הוא שהערך עבור PageLoadStrategy מוגדר כEAGER כאן ב-chromeOptions, ואחריו מתקיים קריאה לשיטת checkPageLoad().

testNoneStrategy()

זהו מקרה מבחן להדגמת האסטרגיה None.

הערך עבור PageLoadStrategy מוגדר כNONE כאן ב-chromeOptions, ושאר השלבים דומים למקרי המבחן הקודמים שדנו בהם.

ביצוע מבחנים

לאחר שהבנו את הפעולה והיישום של כל PageLoadStrategy, בואו נבצע את הקוד ונראה את תוצאות הביצוע במקומי ובלוח המחויג של LambdaTest.

המקרה המבוקש יבוצע באמצעות TestNG. כדי לבצע, בצע את השלבים הבאים:

1. לחץ על הידית על שם המקרה המבוקש ב-Eclipse IDE.
2. עבור ל Run Test, ובחר TestNG Test כדי להתחיל את הביצוע.

בואו נבצע את המקרים אחד אחרי השני ונראה אם זמן הטעינה משתנה עבור כל אסטרגיה.

אסטרגיה NORMAL

ניתן להבחין שזמן TotalPageLoad, במקרה זה, הוא 70852 מילישניות כשאנו משתמשים ברשת במהירות 2G רגילה. קיבלנו שהערך הגבוה ביותר צריך להיות בין שלושת המקרים. כפי שנקבע עד כה, זה צריך להיות הגבוה ביותר מבין שלושתם. ניתן לאמת זאת על ידי הרצת המקרים עבור Eager ו-None והשוואתם.

אסטרגיה EAGER

כצפוי, זמן הטעינה PageLoadTime, כלומר 70231 מילישניות, עבור האסטרגיה Eager באותו תרחיש, נמוך יותר מאשר באסטרגיה NORMAL.

אסטרגיה NONE

אפשר לשים לב כאן שהזמן של PageLoadTime עבור האSTRATEGY של None הוא נמוך באופן משמעותי משני האחרים מכיוון שהוא לא מחכה להורדת שום משאבים.

הנה סיכום מהיר של זמני טעינת הדפים באSTRATEGIES שונים

אפשר גם לראות את תוצאות הביצועים על ידי גלישה ללוגן של LambdaTest כפי שמוצג למטה עבור כל PageLoadStrategy:

אפשר לנavigate לקטגוריה של Builds תחת Automation כדי לראות פרטים על בניית הautomation שלך.

פרטי בנייה עבור PageLoadStrategy.NORMAL:

פרטי בנייה עבור PageLoadStrategy.EAGER:

פרטי בנייה עבור PageLoadStrategy.NONE:

מסקנה

עם זה, הגענו לסוף הSelenium TestNG tutorial הזה על אסטרטגיות טעינת הדף שונות ב-Selenium WebDriver. בכך למדנו על השימוש והפעולה המשך של אסטרטגיות טעינת הדף של Selenium ואיך אפשר לשלב אותם בתסריט הautomation ולבצע על רשת ה-Cloud Grid של Selenium.

I hope now you can implement these in your use cases more efficiently.

שמחים טעינה!!