Skip to content

Commit

Permalink
added testcafe tests and pr workflow (#279)
Browse files Browse the repository at this point in the history
* added testcafe tests and pr workflow

* removed outputs

* debug output value

* empty commit to test pr workflow

* updated version for reusable workflow

* removed extra line

* updated version

* added full image path

* added CONTAINER_REGISTRY_URL & imagepath as env var in test job

* corrected url for saap docs app

* docker run unauthorized

* pull docker image first before running

* added docker run gh action

* login to docker before running image

* added debugging steps in docker run

* run saap-docs in detached mode

* removed -it tag from run tests command

* adjusted test workflow to build and run tests in one job

* wait for saap-docs to run before testing

* keep all the steps in same job so tests can find running app

* adjusted test as it doesn't run on full screen

* run test on chromium

* keep the chromium headless and resize the browser in test to ensure consistency

* removed extra step

* fixed invalid yamls

* resolved pr comments

* removed a console.log

* added yaml with indentation

* corrected indentation to render correct numbering

* empty commit to run pr workflow again

* checking workflow again

* committing yarn.lock

* commit to run workflow again, also maximize window instead of resizing

* empty commit to run workflow

---------

Co-authored-by: Karl Johan Grahn <6355577+karl-johan-grahn@users.noreply.github.com>
  • Loading branch information
zoha-jamil and karl-johan-grahn authored Jul 24, 2024
1 parent d750a9d commit 0104bb2
Show file tree
Hide file tree
Showing 7 changed files with 3,567 additions and 131 deletions.
29 changes: 29 additions & 0 deletions .github/workflows/pull_request.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -21,3 +21,32 @@ jobs:
CONTAINER_REGISTRY_USERNAME: stakater-user
CONTAINER_REGISTRY_PASSWORD: ${{ secrets.STAKATER_GITHUB_TOKEN }}
SLACK_WEBHOOK_URL: ${{ secrets.STAKATER_DELIVERY_SLACK_WEBHOOK }}

test:
runs-on: ubuntu-latest
needs: [build]
env:
IMAGE_PATH: ${{ needs.build.outputs.IMAGE_PATH }}
steps:
- name: Checkout repository
uses: actions/checkout@v4

- name: Login to Docker Registry
uses: docker/login-action@v3
with:
registry: ghcr.io/stakater
username: stakater-user
password: ${{ secrets.STAKATER_GITHUB_TOKEN }}

- name: Run Docker container for the saap-docs app
run: |
docker run -d --name saap-docs -p 8080:8080 ghcr.io/stakater/${{ github.repository }}${{ env.IMAGE_PATH }} || exit 1
- name: Build testcafe tests
working-directory: ./testcafe
run: |
docker build -t testcafe-tests .
- name: Run Docker container to run tests
run: |
docker run --rm --network="host" --name myapp-testcafe-container testcafe-tests:latest
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ SAAP provides a unique domain with every cluster with the format: `*.apps.<CLUST

### 2. Use the `oc new-app` command to create a service

```shell script
```sh
oc new-app https://github.com/openshift/ruby-hello-world
```

Expand Down
260 changes: 130 additions & 130 deletions content/managed-addons/monitoring-stack/grafana-dashboard.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,151 +10,151 @@ This document explains how to create Grafana Dashboard via GrafanaDashboard CR p

1. Create GrafanaDashboard definition

You can choose any existing namespace. The label `grafanaDashboard: grafana-operator` is required for Grafana Operator to discover the dashboard. The JSON string with the dashboard contents is placed in the `json` section. Check the [official documentation](https://grafana.com/docs/reference/dashboard/#dashboard-json) for details on JSON Model. You can create a dashboard via web UI first, and then export the dashboard JSON to define a GrafanaDashboard CR (Custom Resource). If the JSON is invalid, the dashboard will not appear in Grafana web UI. Below is a sample GrafanaDashboard CR YAML.
You can choose any existing namespace. The label `grafanaDashboard: grafana-operator` is required for Grafana Operator to discover the dashboard. The JSON string with the dashboard contents is placed in the `json` section. Check the [official documentation](https://grafana.com/docs/reference/dashboard/#dashboard-json) for details on JSON Model. You can create a dashboard via web UI first, and then export the dashboard JSON to define a GrafanaDashboard CR (Custom Resource). If the JSON is invalid, the dashboard will not appear in Grafana web UI. Below is a sample GrafanaDashboard CR YAML.

```yaml
apiVersion: integreatly.org/v1alpha1
kind: GrafanaDashboard
metadata:
name: grafana-dashboard-example
namespace: test-ns
labels:
grafanaDashboard: grafana-operator
spec:
json: |-
{
"annotations": {
"list": [
{
"builtIn": 1,
"datasource": "-- Grafana --",
"enable": true,
"hide": true,
"iconColor": "rgba(0, 211, 255, 1)",
"name": "Annotations & Alerts",
"type": "dashboard"
}
]
},
"editable": true,
"gnetId": null,
"graphTooltip": 0,
"id": null,
"links": [],
"panels": [
apiVersion: integreatly.org/v1alpha1
kind: GrafanaDashboard
metadata:
name: grafana-dashboard-example
namespace: test-ns
labels:
grafanaDashboard: grafana-operator
spec:
json: |-
{
"aliasColors": {},
"bars": false,
"dashLength": 10,
"dashes": false,
"datasource": null,
"fieldConfig": {
"defaults": {},
"overrides": []
},
"fill": 1,
"fillGradient": 0,
"gridPos": {
"h": 9,
"w": 12,
"x": 0,
"y": 0
},
"hiddenSeries": false,
"id": 2,
"legend": {
"avg": false,
"current": false,
"max": false,
"min": false,
"show": true,
"total": false,
"values": false
},
"lines": true,
"linewidth": 1,
"nullPointMode": "null",
"options": {
"alertThreshold": true
},
"percentage": false,
"pluginVersion": "7.5.11",
"pointradius": 2,
"points": false,
"renderer": "flot",
"seriesOverrides": [],
"spaceLength": 10,
"stack": false,
"steppedLine": false,
"thresholds": [],
"timeFrom": null,
"timeRegions": [],
"timeShift": null,
"title": "Panel Title",
"tooltip": {
"shared": true,
"sort": 0,
"value_type": "individual"
"annotations": {
"list": [
{
"builtIn": 1,
"datasource": "-- Grafana --",
"enable": true,
"hide": true,
"iconColor": "rgba(0, 211, 255, 1)",
"name": "Annotations & Alerts",
"type": "dashboard"
}
]
},
"type": "graph",
"xaxis": {
"buckets": null,
"mode": "time",
"name": null,
"show": true,
"values": []
},
"yaxes": [
{
"format": "short",
"label": null,
"logBase": 1,
"max": null,
"min": null,
"show": true
},
"editable": true,
"gnetId": null,
"graphTooltip": 0,
"id": null,
"links": [],
"panels": [
{
"format": "short",
"label": null,
"logBase": 1,
"max": null,
"min": null,
"show": true
"aliasColors": {},
"bars": false,
"dashLength": 10,
"dashes": false,
"datasource": null,
"fieldConfig": {
"defaults": {},
"overrides": []
},
"fill": 1,
"fillGradient": 0,
"gridPos": {
"h": 9,
"w": 12,
"x": 0,
"y": 0
},
"hiddenSeries": false,
"id": 2,
"legend": {
"avg": false,
"current": false,
"max": false,
"min": false,
"show": true,
"total": false,
"values": false
},
"lines": true,
"linewidth": 1,
"nullPointMode": "null",
"options": {
"alertThreshold": true
},
"percentage": false,
"pluginVersion": "7.5.11",
"pointradius": 2,
"points": false,
"renderer": "flot",
"seriesOverrides": [],
"spaceLength": 10,
"stack": false,
"steppedLine": false,
"thresholds": [],
"timeFrom": null,
"timeRegions": [],
"timeShift": null,
"title": "Panel Title",
"tooltip": {
"shared": true,
"sort": 0,
"value_type": "individual"
},
"type": "graph",
"xaxis": {
"buckets": null,
"mode": "time",
"name": null,
"show": true,
"values": []
},
"yaxes": [
{
"format": "short",
"label": null,
"logBase": 1,
"max": null,
"min": null,
"show": true
},
{
"format": "short",
"label": null,
"logBase": 1,
"max": null,
"min": null,
"show": true
}
],
"yaxis": {
"align": false,
"alignLevel": null
}
}
],
"yaxis": {
"align": false,
"alignLevel": null
}
"schemaVersion": 27,
"style": "dark",
"tags": [],
"templating": {
"list": []
},
"time": {
"from": "now-6h",
"to": "now"
},
"timepicker": {},
"timezone": "",
"title": "New dashboard",
"uid": null,
"version": 0
}
],
"schemaVersion": 27,
"style": "dark",
"tags": [],
"templating": {
"list": []
},
"time": {
"from": "now-6h",
"to": "now"
},
"timepicker": {},
"timezone": "",
"title": "New dashboard",
"uid": null,
"version": 0
}
```
1. Apply GrafanaDashbaord CR to your cluster, manually or via GitOps way
1. View the dashboard via Grafana web UI
1. Under `stakater-workload-monitoring` project, find the URL to Grafana through Cluster menu [Networking]->[Routes]
1. Open Grafana web UI, and go to [Dashboards]->[Manage] to view Dashboards management page
![Grafana-menu](./images/grafana-menu.png)
1. Under `stakater-workload-monitoring` project, find the URL to Grafana through Cluster menu [Networking]->[Routes]
1. Open Grafana web UI, and go to [Dashboards]->[Manage] to view Dashboards management page
![Grafana-menu](./images/grafana-menu.png)

1. Your dashboard will be put in a folder named after the namespace that you specified in GrafanaDashboard definition. The following is an example. ![Grafana-dashboards-management](./images/grafana-dashboards-management.png)
1. Your dashboard will be put in a folder named after the namespace that you specified in GrafanaDashboard definition. The following is an example. ![Grafana-dashboards-management](./images/grafana-dashboards-management.png)

## Application chart

Expand Down
16 changes: 16 additions & 0 deletions testcafe/Dockerfile
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
FROM node:22-alpine
WORKDIR testcafe

ENV XDG_DOWNLOAD_DIR=/opt/JDownloader/Downloads

COPY src src
COPY package.json package.json

RUN echo "Install build deps.." \
&& apk --update --no-cache add \
chromium \
tzdata

RUN yarn

CMD ["yarn", "start"]
12 changes: 12 additions & 0 deletions testcafe/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
{
"name": "saap-docs-testcafe-tests",
"version": "1.0.0",
"dependencies": {
"testcafe": "^3.3.0",
"dotenv": "^16.3.1"
},
"scripts": {
"local": "testcafe chrome src/**.ts",
"start": "testcafe chromium:headless src/**.ts"
}
}
36 changes: 36 additions & 0 deletions testcafe/src/run.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import { fixture, Selector } from "testcafe";

const consentControlsDiv = Selector('.md-consent__controls');
const acceptButton = consentControlsDiv.find('button').withText('Accept');
const searchInput = Selector('input.md-search__input').withAttribute('placeholder', 'Search');
const searchResultItem = Selector('li.md-search-result__item');
const searchLabel = Selector('label.md-header__button.md-icon').withAttribute('for', '__search');


fixture("Check if yamls are valid")
.page`${'http://127.0.0.1:8080/saap'}`
.skipJsErrors();

test(`Accept cookies if cookies consent message is displayed`, async (t) => {
await t.maximizeWindow();

const acceptButtonExists = await acceptButton.exists;

if (acceptButtonExists) {
await t.click(acceptButton);
}

const searchLabelExists = await searchLabel.exists;
const searchLabelVisible = await searchLabel.visible;

if (searchLabelExists && searchLabelVisible) {
await t.click(searchLabel);
}

await t.expect(searchInput.visible).ok();
await t.click(searchInput);
await t.typeText(searchInput, "```")

const searchResultItemExists = await searchResultItem.exists;
await t.expect(searchResultItemExists).notOk('Invalid yamls exist, failing the test');
})
Loading

0 comments on commit 0104bb2

Please sign in to comment.