Automatiskt end-to-end testning är en form av testning-process som utförs helt av script på webbapplikation med mål att simulera en användarupplevelse och ge förmågan att testa produkter mer kontinuerligt under utvecklingen. Företaget SSG använder sig av Javascript-ramverket TestCafé för att skriva automatiska tester som säkerhetsställer kvalité till webbapplikationer som levereras till kunderna. Att skapa dessa tester är ett tidskrävande manuellt arbete som bidrar till minskad motivation för kontinuerligt testande av produkter. Projektet har undersökt en lösning genom att utveckla en VS Code extension som identifierar alla relevanta HTML-element och tar fram selectorer som är lättläsliga och mottagliga för ändringar i HTML-strukturen. Utvecklingen av projektet har använts sig av Data science-metoden för utforskning och lösning av delmål. Implementationen har använt web-scraping tekniker där ramverken Puppeteer och Cheerio har använts för att rendera dynamiskt webbinnehåll, analysera DOM-trädet och extrahera relevant data för att skapa jQuery selectors baserat på ett elements attribut. Selectorer presenteras genom användningen av designmönstret "page model", där selectorerna lagras i en strukturerad modell. Genom IntelliSense som visar klassmedlemmar kan selectorerna presenteras i utvecklingsmiljön. Expansionen kan identifiera alla element men är oförmögen att generera selector till alla element om de enbart förlitar sig på närliggande attributer. För att identifiera dessa element krävs manuell konfiguration av utvecklaren, eftersom det fortfarande krävs någon form av interaktion för att hämta dynamiskt innehåll. / Automatic end-to-end testing is a type of testing process that is performed entirely by scripts on a web application, with the aim of simulating a user experience and enabling more continuous testing of products during development. The company SSG utilizes the JavaScript framework TestCafé to write automated tests that ensure quality for web applications delivered to customers. Creating these tests is a time-consuming manual task that contributes to reduced motivation for continuous product testing. The project has explored a solution by developing a VS Code extension that identifies all relevant HTML elements and generates selectors that are readable and adaptable to changes in the HTML structure. The development of the project has employed the data science method for research and solution of sub-goals. The implementation has utilized web scraping techniques, where the frameworks Puppeteer and Cheerio have been used to render dynamic web content, analyze the DOM tree, and extract relevant data for creating jQuery selectors based on an element's attributes. Selectors are presented using the "page model" design pattern, where they are stored in a structured model. Through IntelliSense displaying class members, the selectors are presented within the development environment. The expansion can identify all elements but is unable to generate selectors for all elements solely relying on adjacent attributes. Manual configuration by the developer is required to identify these elements, as some form of interaction is still needed to fetch dynamically generated content.
| Identifer | oai:union.ndltd.org:UPSALLA1/oai:DiVA.org:miun-49196 |
| Date | January 2023 |
| Creators | Englund, Anton |
| Publisher | Mittuniversitetet, Institutionen för data- och elektroteknik (2023-) |
| Source Sets | DiVA Archive at Upsalla University |
| Language | Swedish |
| Detected Language | English |
| Type | Student thesis, info:eu-repo/semantics/bachelorThesis, text |
| Format | application/pdf |
| Rights | info:eu-repo/semantics/openAccess |
Page generated in 0.002 seconds