Merge pull request #3059 from catchpoint/develop

Develop to master

Author: Mike Kozicki

docker-compose.yml

@@ -61,7 +61,11 @@ services:
     build:
       context: .
       dockerfile: docker/local/Dockerfile-wptagent
-    command: python3 wptagent.py -vvvv --xvfb --dockerized --server  http://web/work/ --location Test --key 123456789
+    environment:
+      - SERVER_URL=http://web/work/
+      - LOCATION=Test
+      - KEY=123456789
+    init: true
   #### ####
 
 secrets:

docker/local/Dockerfile-php

@@ -1,4 +1,4 @@
-FROM alpine:3.13 as build
+FROM alpine:3.18 as build
 
 ARG FFMPEG_VERSION=4.3.2
 ARG PREFIX=/opt/ffmpeg
@@ -104,11 +104,13 @@ RUN apk add --no-cache supervisor beanstalkd zip libzip python3 libtheora rtmpdu
     && rm -rf /var/cache/apk/*
 
 COPY --from=build /opt/ffmpeg /opt/ffmpeg
-COPY --from=build /usr/lib/libfdk-aac.so.2 /usr/lib/libfdk-aac.so.2
-COPY --from=build /usr/lib/librav1e.so.0 /usr/lib/librav1e.so.0
-COPY --from=build /usr/lib/libx264.so.157 /usr/lib/libx264.so.157
-COPY --from=build /usr/lib/libvpx.so.6 /usr/lib/libvpx.so.6
-COPY --from=build /usr/lib/libx265.so.192 /usr/lib/libx265.so.192
+COPY --from=build /usr/lib/libssl.so* /usr/lib/
+COPY --from=build /usr/lib/libcrypto.so* /usr/lib/
+COPY --from=build /usr/lib/libfdk-aac.so* /usr/lib/
+COPY --from=build /usr/lib/librav1e.so* /usr/lib/
+COPY --from=build /usr/lib/libx264.so* /usr/lib/
+COPY --from=build /usr/lib/libvpx.so* /usr/lib/
+COPY --from=build /usr/lib/libx265.so* /usr/lib/
 
 COPY docker/local/server/config/fpm-pool.conf /etc/php7/php-fpm.d/www.conf
 COPY docker/local/server/config/php.ini /usr/local/etc/php/

docker/local/Dockerfile-wptagent

@@ -17,53 +17,61 @@
 ###     Recommend to install with "docker build <GITHUB-REPO-LINK> -t TAGNAME",
 ###     grabs the latest copy of WPT and build time on average takes 10 minutes. 
 
-FROM ubuntu
+FROM ubuntu:22.04 as production
+
+### TIMEZONE INSIDE THE CONTAINER ###
+ARG TIMEZONE=UTC
 
 ### PREVENTs INTERACTIVE PROMPTS WHILE INSTALLING ###
 ARG DEBIAN_FRONTEND=noninteractive
 
-### COPYING ENTIRE DIR TO LOCAL DOCKER /wptagent
-#COPY / /wptagent
-RUN apt-get update
-
-# Install software 
-RUN apt-get install -y git
-RUN git clone -b master https://github.com/WPO-Foundation/wptagent.git
-#COPY docker/linux-headless/entrypoint.sh /wptagent/entrypoint.sh
-
 ### UPDATE ###
-RUN apt-get update 
+RUN curl -sL https://deb.nodesource.com/setup_16.x | bash -
+RUN apt update 
 
 ### INSTALL APT-GET LIBS ###
-RUN xargs -a /wptagent/.github/workflows/docker-apt-get.txt apt-get install --no-install-recommends --yes
+# set default timezone beforehand to avoid user interaction for tzdata package
+RUN ln -fs /usr/share/zoneinfo/$TIMEZONE /etc/localtime && apt install -y \
+    git \
+    python3 python3-pip python3-ujson \
+    imagemagick dbus-x11 traceroute software-properties-common psmisc libnss3-tools iproute2 net-tools openvpn \
+    libtiff5-dev libjpeg-dev zlib1g-dev libfreetype6-dev liblcms2-dev libwebp-dev tcl8.6-dev tk8.6-dev python3-tk \
+    python3-dev libavutil-dev libmp3lame-dev libx264-dev yasm autoconf automake build-essential libass-dev libfreetype6-dev libtheora-dev \
+    libtool libvorbis-dev pkg-config texi2html libtext-unidecode-perl python3-numpy python3-scipy perl \
+    adb ethtool nodejs cmake git-core libsdl2-dev libva-dev libvdpau-dev libxcb1-dev libxcb-shm0-dev libxcb-xfixes0-dev texinfo wget \
+    ttf-mscorefonts-installer fonts-noto fonts-roboto fonts-open-sans ffmpeg npm sudo curl xvfb
+
+# Get WPTAgent for dependecies
+RUN git clone -b master https://github.com/WPO-Foundation/wptagent.git
 
-### UPGRADING PIP AND INSTALLING REQUIRED PACKAGES ###
-RUN python3 -m pip install --upgrade --user pip && \
-    python3 -m pip install --user -r /wptagent/.github/workflows/requirements.txt 
+### UPDATE FONT CACHE ###
+RUN fc-cache -f -v
 
 ### INSTALLING LIGHTHOUSE FROM NPM ###
 RUN npm install -g lighthouse
 
 ### INSTALLING CHROME BROWSER ###
-###     Fails to Find all libs needed to run
-# RUN wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb && \
-#     dpkg -i google-chrome-stable_current_amd64.deb; exit 0 && \
-#     apt -f install -y && \
-#     apt-get install google-chrome-stable
+RUN curl -o /tmp/google-chrome-stable_current_amd64.deb  https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb && \
+    apt install -y /tmp/google-chrome-stable_current_amd64.deb && rm /tmp/google-chrome-stable_current_amd64.deb
 
-### BETTER INSTALLING CHROME BROWSER METHOD ###
-###     Better Installing method but would like to change this to something less complex.
-RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - \
-    && echo "deb http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list
-RUN apt-get update && apt-get -y install google-chrome-stable ; exit 0
-RUN apt-get update --fix-missing -y
-RUN apt-get install -f -y
+### UPGRADING PIP AND INSTALLING REQUIRED PACKAGES ###
+RUN python3 -m pip install --upgrade --user pip && \
+    python3 -m pip install --user -r /wptagent/.github/workflows/requirements.txt 
 
-### CLEAN UP ###
-#       We could add some clean up here but in testing it was negotiable
+WORKDIR /wptagent
 
+ENTRYPOINT ["/bin/sh", "/wptagent/docker/linux-headless/entrypoint.sh"]
 
-WORKDIR /wptagent
+### DEBUG CONTAINER ###
+# To build the debug container add `--target debug` as a build parameter
+FROM production as debug
+
+### INSTALLING DEBUG DEPENDENCIES ###
+RUN pip install debugpy
+
+### COPY DEBUG AGENT AND MOVE REAL ONE ###
+RUN mv wptagent.py wptagent_starter.py
+COPY wptagent_debug.py wptagent.py
 
-### /bin/bash LOCATION OF COMMAND EXECUTION ###
-#CMD ["python3","wptagent.py", "-vvvv", "--xvfb", "--server", "http://web/work/", "--location", "Test", "--key", "123456789"]
+### SETTING PRODUCTION BUILD AS DEFAULT ###
+FROM production

docker/local/README.md

@@ -40,12 +40,16 @@ Since the Webpagetest container is packaged with an agent, we first need to stop
 ```docker-compose.yml
   #### DOCKER WPTAGENT - comment this out to run a standalone agent ####
   agent:
-    cap_add:
+    cap_add: #### Allows traffic shapping
       - NET_ADMIN
     build:
       context: .
       dockerfile: docker/local/Dockerfile-wptagent
-    command: python3 wptagent.py -vvvv --xvfb --dockerized --server  http://web/work/ --location Test --key 123456789
+    environment:
+      - SERVER_URL=http://web/work/
+      - LOCATION=Test
+      - KEY=123456789
+    init: true
   #### ####
 ```
 

www/assets/css/account.css

@@ -218,7 +218,7 @@ body.theme-b {
 .modal-open {
   visibility: visible;
   display: block;
-  z-index: 1001;
+  z-index: 10000001;
   background: rgb(244, 244, 244);
   box-sizing: border-box;
   padding: 5vh;

www/assets/css/pagestyle2.css

@@ -4467,7 +4467,6 @@ h2.light {
 
 table.history,
 table.checklist {
-  border-collapse: collapse;
   font-size: 0.875em;
   margin: 0;
 }
@@ -4525,7 +4524,7 @@ table.checklist td {
 
 .history td.location {
   white-space: nowrap;
-  max-width: 10vw;
+  max-width: 500px;
   overflow: auto;
 }
 
@@ -6675,7 +6674,6 @@ table.pretty {
   margin-left: auto;
   margin-right: auto;
   background-color: #fff;
-  border-collapse: collapse;
   border: 0;
 }
 

www/assets/images/pat.jpg

@@ -98,7 +98,7 @@ function wptLogout(redirectUrl) {
         if (t.hasClass("keep_alive_enabled")) {
           return "Click the grade to see the requests that did not have keep-alives enabled";
         } else if (t.hasClass("security")) {
-          return "Click the grade to see the full security score detailed report";
+          return "Security score";
         } else if (t.hasClass("compress_text")) {
           return "Click the grade to see the requests that should be gzipped but were not";
         } else if (t.hasClass("compress_images")) {

www/assets/js/site.js

@@ -28,8 +28,7 @@
                                     $lighthouse = $urlGenerator->resultPage("lighthouse");
                                     echo "<li class=\"$check\"><a href=\"$lighthouse\"><h2 class=\"{$grade['class']}\">{$grade['grade']}</h2></a>{$grade['description']}</li>";
                                 } elseif ($check == 'security') {
-                                    $snykUrl = "https://snyk.io/test/website-scanner/?test={$id}&utm_medium=referral&utm_source=webpagetest&utm_campaign=website-scanner";
-                                    echo "<li class=\"$check\"><a href=\"$snykUrl\"><h2 class=\"{$grade['class']}\">{$grade['grade']}</h2></a>{$grade['description']}</li>";
+                                    echo "<li class=\"$check\"><a><h2 class=\"{$grade['class']}\">{$grade['grade']}</h2></a>{$grade['description']}</li>";
                                 } else {
                                     echo "<li class=\"$check\"><a href=\"#$check\"><h2 class=\"{$grade['class']}\">{$grade['grade']}</h2></a>{$grade['description']}</li>";
                                 }