Skip to content

pageobjects#71

Closed
ext wants to merge 2 commits intomainfrom
docs/pageobject-test
Closed

pageobjects#71
ext wants to merge 2 commits intomainfrom
docs/pageobject-test

Conversation

@ext
Copy link
Contributor

@ext ext commented Oct 10, 2024

No description provided.

@github-actions
Copy link

github-actions bot commented Oct 10, 2024

PR Preview Action v1.4.8
Preview removed because the pull request was closed.
2024-12-05 08:13 UTC

Copy link
Contributor Author

@ext ext left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@mitra-Re Tog mig friheten att granska härifrån istället då den andra pull requesten inte riktigt verkar helt korrekt. Det jag gjort är att jag fokuserat på FLabelPageObject men det mesta gäller samtliga page objekt.

@@ -0,0 +1,37 @@
---
name: FTextFieldPageObject:FLabel
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

name ska nog inte innehålla FTextFieldPageObject här

layout: content-with-menu
---

FTextFieldPageObject: FLabel property
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Eftersom FLabelPageObject är sin egna grej ska vi nog försöka beskriva det som det.

Suggested change
FTextFieldPageObject: FLabel property
FTextFieldPageObject: FTextFieldPageObject() constructor

---
name: FTextFieldPageObject:FLabel
title: FLabel
layout: content-with-menu
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
layout: content-with-menu
layout: article


FTextFieldPageObject: FLabel property

`FLabel` används för att visa etiketter för att filtera innehåll.
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Texten ska kanske snarare beskriva att detta är pageobjektet som används för att testa mot FLabel, nu låter det som en förklaring av vad FLabel är.

## Syntax

```ts
textfield.FLabel;
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
textfield.FLabel;
new FLabelPageObject(selector: string);

```ts
const awesomeInput = new FTextFieldPageObject("[data-test=awesome-input]");

awesomeInput.FLabel.el().should("contain.text", "My Awesome Input");
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Exemplet här är nog inte riktigt korrekt och vi bör nog gå direkt på FLabelPageObject istället för via FTextFieldPageObject även om den har en .label() metod som ger till tillgången till dess etikett. Det sista är något jag förväntar mig hitta under dokumentationen för FTextFieldPageObject inte FLabelPageObject.

awesomeInput.FLabel.el().should("contain.text", "My Awesome Input");
```

## Examples
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Duplicerad rubrik


## See also

- {@link inmatningsfalt}
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Länka till FLabel istället?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Här vore nice om vi kunde använda oss av snippets för att minimera hur mycket kod som läsaren behöver se, något likt:

 import { FTextFieldPageObject } from "@fkui/vue/pageobject";

 beforeEach(() => {
     cy.visit("/components/label.html");
 });

 it("should have correct label", () => {
+    /* --- cut above --- */
     const awesomeInput = new FTextFieldPageObject("[data-test=awesome-input]");

     awesomeInput.label.el().should("contain.text", "My Awesome Input");
+    /* --- cut below --- */
 });

Resultatet är då att i dokumentationen så visas bara:

     const awesomeInput = new FTextFieldPageObject("[data-test=awesome-input]");

     awesomeInput.label.el().should("contain.text", "My Awesome Input");

Och det är ju det som är det relevanta för läsaren, resten är nog ganska oviktigt.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@NicklasWei Tror du vi kan få till det så detta är ett komponenttest istället? Vet inte exakt hur men jag tänker mig att:

  1. Vi skapar en .vue fil som innehåller html/vue koden som dokumentationen visar, denna filen används både i md-filen och i komponenttestet.
  2. Vi skapar en .cy.ts fil som monterar upp vue-filen och med snippets likt ovan bara presenterar den relevanta delen ur testet men när an kör testet så körs såklart allt eftersom snippets bara är js kommentarer.
  3. Katalog- och filstrukturen blir något likt:
docs/api/pageobjects/FLabel/FLabel.md
docs/api/pageobjects/FLabel/FLabel.vue
docs/api/pageobjects/FLabel/FLabel.cy.ts
docs/api/pageobjects/FLabel/FLabel-description.md
docs/api/pageobjects/FLabel/FLabel-description.vue
docs/api/pageobjects/FLabel/FLabel-description.cy.ts

Så 1:1 mappat där varje md-fil har exakt en svit med testfall (som antagligen bara innehåller exakt ett testfall).

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Det är en bra början för själva konstructorn till FLabel, utöver det så behöver vi också dokumentera dess egenskaper:

  • el
  • description
  • discreteDescription
  • errorMessage
  • errorIcon

Vi har också

  • trimmedText

Men tveksam till om vi ska dokumentera den, tycker den ska tas bort istället.

@mitra-Re mitra-Re force-pushed the docs/pageobject-test branch from bd56ccb to e1d3979 Compare December 5, 2024 08:11
@ext ext closed this Dec 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants