Merge pull request #33 from sdsc-ordes/feat/stateful-workflow

.github/workflows/python-pycov-onPR.yml

@@ -24,8 +24,10 @@ jobs:
         if [ -f tests/requirements.txt ]; then pip install -r tests/requirements.txt; fi
 
     - name: Build coverage files for mishakav commenter action
+      # note this will run all non-visual tests, including the slow end2end ones
+      # - this action is only on PR; the slow ones are skipped on push.
       run: |
-        pytest --junitxml=pytest.xml --cov-report=term-missing:skip-covered --cov=src tests/ | tee pytest-coverage.txt
+        pytest -s -m "not visual" --ignore=tests/visual_selenium --junitxml=pytest.xml --cov-report=term-missing:skip-covered --cov=src tests/ | tee pytest-coverage.txt
         echo "working dir:" && pwd
         echo "files in cwd:" && ls -ltr
 
@@ -36,4 +38,4 @@ jobs:
         junitxml-path: ./pytest.xml
 
     #- name: Comment coverage
-    #  uses: coroo/[email protected]
+    #  uses: coroo/[email protected]

.github/workflows/python-pytest.yml

@@ -5,7 +5,7 @@ name: Execute tests with pytest
 
 on:
   push:
-    branches: [ "dev" ]
+    branches: [ "dev"  ]
   pull_request:
     branches: [ "dev", "main" ]
 permissions:
@@ -31,6 +31,6 @@ jobs:
     #    flake8 . --count --select=E9,F63,F7,F82 --show-source --statistics
     #    # exit-zero treats all errors as warnings. The GitHub editor is 127 chars wide
     #    flake8 . --count --exit-zero --max-complexity=10 --max-line-length=127 --statistics
-    - name: Test with pytest
+    - name: Run quick tests with pytest
       run: |
-        pytest
+        pytest -m "not slow and not visual" --strict-markers --ignore=tests/visual_selenium

.github/workflows/python-visualtests.yml

@@ -0,0 +1,53 @@
+name: Visual tests of the app
+
+on:
+  workflow_dispatch: 
+  push:
+    branches: [ "feat/stateful-workflow"  ]
+  #pull_request:
+  #  branches: [ "dev", "main" ]
+
+
+permissions:
+    contents: read
+
+jobs:
+   test:
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v4
+    - name: Set up Python 3.10
+      uses: actions/setup-python@v3
+      with:
+        python-version: "3.10"
+
+        
+    - name: install chrome
+      run: |
+        sudo apt-get install -y wget
+        sudo bash -c "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"
+        sudo apt-get update && sudo apt-get -y install google-chrome-stable
+
+    - name: Install py dependencies
+      run: |
+        python -m pip install --upgrade pip
+        if [ -f requirements.txt ]; then pip install -r requirements.txt; fi
+        if [ -f tests/requirements.txt ]; then pip install -r tests/requirements.txt; fi
+        if [ -f tests/visual_selenium/requirements_visual.txt ]; then pip install -r tests/visual_selenium/requirements_visual.txt; fi
+
+    - name: Check the console scripts interface
+      run: |
+        seleniumbase
+        sbase
+    - name: Install chromedriver
+      run: |
+        seleniumbase install chromedriver
+
+
+
+    - name: Run visual tests with pytest
+      # we use --demo to make it slow enough (selenium doesn't wait long enough
+      # otherwise, not one step it consistently fails at.)
+      run: |
+            pytest -m "visual" --strict-markers tests/visual_selenium/ -s --demo

.gitignore

@@ -142,6 +142,7 @@ venv.bak/
 
 # mkdocs documentation
 /site
+docs/site
 
 # mypy
 .mypy_cache/

docs/{classifier_cetacean.md → classifier_image.md}

@@ -1,3 +1,3 @@
 This module documents the cetacean fluke and fin classifier. 
 
-::: src.classifier.cetacean_image
+::: src.classifier.classifier_image

docs/dev_notes.md

@@ -44,6 +44,25 @@ mkdocs build -c
 
 # Testing
 
+## use of markers
+
+The CI runs with `--strict-markers` so any new marker must be registered in
+`pytest.ini`. 
+
+- the basic CI action runs the fast tests only, skipping all tests marked
+  `visual` and `slow`
+- the CI action on PR runs the `slow` tests, but stil excluding `visual`. 
+- TODO: a new action for the visual tests is to be developed.
+
+Check all tests are marked ok, and that they are filtered correctly by the 
+groupings used in CI:
+```bash
+pytest --collect-only -m "not slow and not visual" --strict-markers --ignore=tests/visual_selenium
+pytest --collect-only -m "not visual" --strict-markers --ignore=tests/visual_selenium
+```
+
+
+
 ## local testing
 To run the tests locally, we have the standard dependencies of the project, plus the test runner dependencies. 
 
@@ -74,6 +93,39 @@ pytest --junit-xml=test-results.xml
 pytest --cov-report=lcov --cov=src
 ```
 
+## local testing for visual tests 
+
+We use seleniumbase to test the visual appearance of the app, including the
+presence of elements that appear through the workflow.  This testing takes quite
+a long time to execute and is not yet configured with CI. 
+
+```bash
+# install packages for app and for visual testing
+pip install ./requirements.txt
+pip install -r tests/visual_selenium/requirements_visual.txt
+```
+
+**Running tests**
+The execution of these tests requires that the site/app is running already.
+
+In one tab:
+```bash
+streamlit run src/main.py
+```
+
+In another tab: 
+```bash
+# run just the visual tests
+pytest -m "visual" --strict-markers
+# run in demo mode, using firefox (default is chrome)
+pytest -m "visual" --strict-markers -s browser=firefox --demo
+
+# the inverse set:
+pytest -m "not slow and not visual" --strict-markers --ignore=tests/visual_selenium
+
+```
+
+
 
 ## CI testing
 

docs/st_logs.md

@@ -3,5 +3,5 @@ This module provides utilities to incorporate a standard python logger within st
 
 # Streamlit log handler 
 
-::: src.st_logs
+::: src.utils.st_logs
 

mkdocs.yaml

@@ -33,7 +33,7 @@ nav:
         - Data extraction and validation: input_validator.md
         - Data Object Class: input_observation.md
       - Classifiers: 
-        - Cetacean Fluke & Fin Recognition: classifier_cetacean.md
+        - Cetacean Fluke & Fin Recognition: classifier_image.md
         - (temporary) Hotdog Classifier: hotdog.md
       - Hugging Face Integration: 
         - Push Observations to Dataset: hf_push_observations.md

pytest.ini

@@ -3,3 +3,8 @@ pythonpath = "src"
 testpaths = 
     tests
 
+markers =
+    component: 
+    end2end: following several steps of workflow
+    visual: rendering the site (using selenium)
+    slow: more than 5 seconds

src/apptest/demo_elements.py

@@ -0,0 +1,25 @@
+# a small library of elements used in testing, presenting some 
+# processed data in simple ways that are easily testable via AppTest
+from typing import List
+import streamlit as st
+from input.input_handling import (
+    get_image_datetime, get_image_latlon
+)
+
+def show_uploaded_file_info():
+    if "file_uploader_data" not in st.session_state or \
+        not st.session_state.file_uploader_data:
+    
+        st.write("No files uploaded yet")
+        return
+
+    st.write("the buffered files:")
+    
+    uploaded_files:List = st.session_state.file_uploader_data
+    for ix, file in enumerate(uploaded_files):
+        image_datetime_raw = get_image_datetime(file)
+        latitude0, longitude0 = get_image_latlon(file)
+        s = f"index: {ix}, name: {file.name}, datetime: {image_datetime_raw}, lat: {latitude0}, lon:{longitude0}"
+        st.text_area(f"{file.name}", value=s, key=f"metadata_{ix}")
+        print(s)
+

src/apptest/demo_input_sidebar.py

@@ -0,0 +1,44 @@
+# a chunk of the full app, covering the elements presented on the sidebar
+# - this includes both input and workflow items.
+import streamlit as st
+
+# to run streamlit from this subdir, we need the the src dir on the path
+# NOTE: pytest doesn't need this to run the tests, but to develop the test
+# harness is hard without running streamlit 
+import sys
+from os import path
+# src (parent from here)
+src_dir = path.dirname( path.dirname( path.abspath(__file__) ) )
+sys.path.append(src_dir)
+
+from input.input_handling import (
+    init_input_data_session_states,
+    init_input_container_states,
+    add_input_UI_elements,
+    setup_input,
+)
+from utils.workflow_ui import refresh_progress_display, init_workflow_viz, init_workflow_session_states
+
+from apptest.demo_elements import show_uploaded_file_info
+
+
+
+if __name__ == "__main__":
+    
+    init_input_data_session_states()
+    init_input_container_states()
+    init_workflow_session_states()
+
+    init_workflow_viz()
+
+
+    with st.sidebar:
+        refresh_progress_display()
+        # layout handling
+        add_input_UI_elements()
+        # input elements (file upload, text input, etc)
+        setup_input()
+
+    # as a debug, let's add some text_area elements to show the files  (no clash
+    #   with testing the prod app since we dont use text_area at all)
+    show_uploaded_file_info ()

src/apptest/demo_multifile_upload.py

@@ -0,0 +1,65 @@
+# a minimal snippet for validating the upload sequence, for testing purposes (with AppTest)
+from typing import List
+import streamlit as st
+
+# to run streamlit from this subdir, we need the the src dir on the path
+# NOTE: pytest doesn't need this to run the tests, but to develop the test
+# harness is hard without running streamlit 
+import sys
+from os import path
+# src (parent from here)
+src_dir = path.dirname( path.dirname( path.abspath(__file__) ) )
+sys.path.append(src_dir)
+
+# we aim to validate: 
+# - user uploads multple files via FileUploader (with key=file_uploader_data)
+# - they get buffered into session state
+# - some properties are extracted from the files, and are displayed in a visual
+#   element so we can validate them with apptest.
+
+
+from input.input_handling import (
+    spoof_metadata, is_valid_email,
+    get_image_datetime, get_image_latlon,
+    init_input_data_session_states
+)
+
+def buffer_uploaded_files():
+    st.write("buffering files! ")
+    uploaded_files:List = st.session_state.file_uploader_data
+    for ix, file in enumerate(uploaded_files):
+        image_datetime_raw = get_image_datetime(file)
+        latitude0, longitude0 = get_image_latlon(file)
+        #st.write(f"- file {ix}: {file.name}")
+        #st.write(f"  - datetime: {image_datetime_raw}")
+        #st.write(f"  - lat/lon: {latitude0}, {longitude0}")
+        s = f"index: {ix}, name: {file.name}, datetime: {image_datetime_raw}, lat: {latitude0}, lon:{longitude0}"
+        st.text_area(f"{file.name}", value=s, key=f"metadata_{ix}")
+        print(s)
+        
+init_input_data_session_states()
+
+with st.sidebar:
+    author_email = st.text_input("Author Email", spoof_metadata.get('author_email', ""),
+                                                key="input_author_email")
+    if author_email and not is_valid_email(author_email):   
+        st.error("Please enter a valid email address.")
+
+    st.file_uploader(
+        "Upload one or more images", type=["png", 'jpg', 'jpeg', 'webp'],
+        accept_multiple_files=True, 
+        key="file_uploader_data", 
+        on_change=buffer_uploaded_files
+        )
+
+# this is the callback that would be triggered by the FileUploader
+# - unfortunately, we get into a mess now
+#   - in real app, this runs twice and breaks (because of the duplicate keys)
+#   - in the test, if we don't run manually, we don't get the frontend elements to validate
+#   - if we remove the on_change, both run ok. but it deviates from the true app.
+# - possible ways forward?
+#   - could we patch the on_change, or substitute the buffer_uploaded_files?
+if (1 and "file_uploader_data" in st.session_state and 
+    len(st.session_state.file_uploader_data) ):
+    print(f"buffering files: {len(st.session_state.file_uploader_data)}")
+    buffer_uploaded_files()

src/input/input_handling.py

@@ -116,7 +116,7 @@ def buffer_uploaded_files():
     
 
     # get files from state 
-    uploaded_files = st.session_state.file_uploader_data
+    uploaded_files:List = st.session_state.file_uploader_data
     
     filenames = []
     images = {}
@@ -127,6 +127,7 @@ def buffer_uploaded_files():
         print(f"[D] processing {ix}th file {filename}. {file.file_id} {file.type} {file.size}")
         # image to np and hash both require reading the file so do together
         image, image_hash = load_file_and_hash(file)
+        print(f"   [D] {ix}th file {filename} hash: {image_hash}")
         
         filenames.append(filename)
         image_hashes.append(image_hash)
@@ -178,7 +179,7 @@ def metadata_inputs_one_file(file:UploadedFile, image_hash:str, dbg_ix:int=0) ->
         _viewcontainer = st.session_state.container_metadata_inputs
     else:
         _viewcontainer = st.sidebar
-        m_logger.warning(f"[W] `container_metadata_inputs` is None, using sidebar")
+        m_logger.warning("[W] `container_metadata_inputs` is None, using sidebar")
         
 
 
@@ -261,7 +262,7 @@ def _setup_dynamic_inputs() -> None:
     # - and these go into session state
     
     # load the files from the session state
-    uploaded_files = st.session_state.files
+    uploaded_files:List = st.session_state.files
     hashes = st.session_state.image_hashes
     #images = st.session_state.images
     observations = {}
@@ -368,7 +369,7 @@ def init_input_data_session_states() -> None:
         st.session_state.images = {}
 
     if "files" not in st.session_state:
-        st.session_state.files = {}
+        st.session_state.files = []
 
     if "public_observations" not in st.session_state:
         st.session_state.public_observations = {}

src/input/input_validator.py

@@ -22,7 +22,7 @@ def generate_random_md5(length:int=16) -> str:
     """
 
     # Generate a random string
-    random_string = ''.join(random.choices(string.ascii_letters + string.digits, length=16))
+    random_string = ''.join(random.choices(string.ascii_letters + string.digits, k=length))
     # Encode the string and compute its MD5 hash
     md5_hash = hashlib.md5(random_string.encode()).hexdigest()
     return md5_hash

src/main.py

@@ -140,7 +140,7 @@ def main() -> None:
         # the goal of this tab is to allow selection of the new obsvation's location by map click/adjust.
         st.markdown("Coming later! :construction:")
         st.markdown(
-            f"""*The goal is to allow interactive definition for the coordinates of a new
+            """*The goal is to allow interactive definition for the coordinates of a new
             observation, by click/drag points on the map.*""")
         
 
@@ -226,7 +226,8 @@ def main() -> None:
         
         if st.session_state.workflow_fsm.is_in_state('data_entry_validated'):
             # show the button, enabled. If pressed, we start the ML model (And advance state)
-            if tab_inference.button("Identify with cetacean classifier"):
+            if tab_inference.button("Identify with cetacean classifier", 
+                                    key="button_infer_ceteans"):
                 cetacean_classifier = AutoModelForImageClassification.from_pretrained(
                     "Saving-Willy/cetacean-classifier", 
                     revision=classifier_revision, 

tests/test_demo_input_sidebar.py

@@ -0,0 +1,264 @@
+
+from pathlib import Path
+from io import BytesIO
+from PIL import Image
+import numpy as np
+
+import pytest
+from unittest.mock import MagicMock, patch
+from streamlit.testing.v1 import AppTest
+from datetime import datetime, timedelta
+import time
+
+from input.input_handling import spoof_metadata
+from input.input_observation import InputObservation
+from input.input_handling import buffer_uploaded_files
+
+from streamlit.runtime.uploaded_file_manager import UploadedFile
+
+from test_demo_multifile_upload import (
+    mock_uploadedFile_List_ImageData, mock_uploadedFile,
+    MockUploadedFile, )
+
+
+# decorator that counts the number of times a function is called
+def count_calls(func):
+    def wrapper(*args, **kwargs):
+        wrapper.called += 1
+        return func(*args, **kwargs)
+    wrapper.called = 0
+    return wrapper
+
+
+@count_calls
+def wrapped_buffer_uploaded_files(*args, **kwargs):
+    import streamlit as st
+    uploaded_files = st.session_state.file_uploader_data
+    _cprint(f"[I] buffering files in my side-effect! cool | {len(uploaded_files)}")
+    for i, (key, img) in enumerate(st.session_state.images.items()):
+        _cprint(f"    - image {i}: {type(img)} [{key}]")
+
+    buffer_uploaded_files() # nowcall the real prod func
+    _cprint(f"[I] finished the real buffering ! cool | {len(uploaded_files)}")
+
+    
+@count_calls
+def wrapped_buffer_uploaded_files_allowed_once(*args, **kwargs):
+    # this is a wrapper that only allows the real function to be called once
+    # - this is to prevent the side-effect from being called multiple times
+    # - the callback is only invoked when the input data is changed for the 
+    #   real file_uploader object; but due to the 're-run script on interaction' 
+    #   model, the side-effect is called each time.
+    import streamlit as st
+    uploaded_files = st.session_state.file_uploader_data
+    if len(st.session_state.images) != 0:
+        _cprint(f"[I] buffering already called before, side-effect! not rerun inner func | {len(uploaded_files)} | {len(st.session_state.images)}")
+        for i, (key, img) in enumerate(st.session_state.images.items()):
+            _cprint(f"    - image {i}: {type(img)} [{key}]")
+        return
+    
+    _cprint(f"[I] buffering files in my side-effect! cool | {len(uploaded_files)}")
+    for i, (key, img) in enumerate(st.session_state.images.items()):
+        _cprint(f"    - image {i}: {type(img)} [{key}]")
+
+    buffer_uploaded_files() # nowcall the real prod func
+    _cprint(f"[I] finished the real buffering ! cool | {len(uploaded_files)}")
+    
+    
+
+# - tests for apptest/demo_input_sidebar 
+
+# zero test: no inputs 
+#   -> empty session state
+#   -> file_uploader with no files, ready to accept input
+#   -> a couple of containers
+#   -> not much on the main tab.
+
+# many test: list of 2 inputs
+#   -> session state with 2 files
+#   -> file_uploader with 2 files, ready to accept more
+#   -> the metadata container will have two groups inside, with several input elements
+#   -> the main tab will have a couple of text_area elements showing the uploaded file metadata
+
+
+OKBLUE = '\033[94m'
+OKGREEN = '\033[92m'
+OKCYAN = '\033[96m'
+FAIL = '\033[91m'
+PURPLE = '\033[35m'
+ENDC = '\033[0m'
+
+def _cprint(msg:str, color:str=OKCYAN):
+    print(f"{color}{msg}{ENDC}")
+
+
+TIMEOUT = 10
+#SCRIPT_UNDER_TEST = "src/main.py"
+SCRIPT_UNDER_TEST = "src/apptest/demo_input_sidebar.py"
+
+def verify_initial_session_state(at:AppTest):
+    # the initialised states we expect 
+    # - container_file_uploader exists
+    # - container_metadata_inputs exists
+    # - observations {}
+    # - image_hashes []
+    # - images {}
+    # - files []
+    # - public_observations {}
+    assert at.session_state.observations == {}
+    assert at.session_state.image_hashes == []
+    assert at.session_state.images == {}
+    assert at.session_state.files == []
+    assert at.session_state.public_observations == {}
+    assert "container_file_uploader" in at.session_state
+    assert "container_metadata_inputs" in at.session_state
+
+def verify_session_state_after_processing_files(at:AppTest, num_files:int):
+    # this is after buffering & metadata extraction, but *BEFORE* the ML is run. 
+
+    # now we've processed the files and got metadata, we expect some
+    # changes in the elements in the session_state (x=same)
+        # x container_file_uploader exists
+        # x container_metadata_inputs exists
+        # - observations 2 elements, keys -> some hashes. values: InputObservation objects
+        # - image_hashes 2 elements, hashes (str) | 
+        # - images {} 2 elements, keys -> hashes, values -> np.ndarray. 
+        # - files [] a list of 2 MockUploadedFile objects
+        # x public_observations {}
+    # I think just verify the sizes and types, we could do a data integrity 
+    # check on the hashes matching everywhere, but that is far from visual.
+     
+    assert len(at.session_state.observations) == num_files
+    for obs in at.session_state.observations.values():
+        assert isinstance(obs, InputObservation)
+    assert len(at.session_state.image_hashes) == num_files
+    for hash in at.session_state.image_hashes:
+        assert isinstance(hash, str)
+    assert len(at.session_state.images) == num_files
+    for img in at.session_state.images.values():
+        assert isinstance(img, np.ndarray)
+    assert len(at.session_state.image_hashes) == num_files
+    for hash in at.session_state.image_hashes:
+        assert isinstance(hash, str)
+    assert len(at.session_state.files) == num_files
+    for file in at.session_state.files:
+        assert isinstance(file, MockUploadedFile)
+        assert isinstance(file, BytesIO) # cool it looks like the FileUploader.
+        #assert isinstance(file, UploadedFile) no... it isn't  but bytesIO is the parent class
+
+    assert at.session_state.public_observations == {}
+
+def verify_metadata_in_demo_display(at:AppTest, num_files:int):
+    # we can check the metadata display in the main area
+    # - this presentation is not part of the normal app, but is a test-only feature
+
+    if 'src/main.py' in SCRIPT_UNDER_TEST:
+        raise ValueError("This test is not valid for the main app, only for unit/component test snippets")
+
+    # finally we can check the main area, where the metadata is displayed
+    # since we uplaoded num_files files, hopefully we get num_files text areas 
+    assert len(at.text_area) == num_files
+    # expecting 
+    exp0 = "index: 0, name: cakes.jpg, datetime: 2024:10:24 15:59:45, lat: 46.51860277777778, lon:6.562075"
+    exp1 = "index: 1, name: cakes_no_exif_datetime.jpg, datetime: None, lat: 46.51860277777778, lon:6.562075"
+    exp2 = "index: 2, name: cakes_no_exif_gps.jpg, datetime: 2024:10:24 15:59:45, lat: None, lon:None"
+
+    assert at.text_area[0].value == exp0
+    assert at.text_area[1].value == exp1
+    if num_files >= 1:
+        assert at.text_area(key='metadata_0').value == exp0
+    if num_files >= 2:
+        assert at.text_area(key='metadata_1').value == exp1
+    if num_files >= 3:
+        assert at.text_area(key='metadata_2').value == exp2
+
+@pytest.mark.component
+def test_no_input_no_interaction():
+    
+    # zero test: no inputs 
+    #   -> empty session state (ok many initialised, but empty data)
+    #   -> file_uploader with no files, ready to accept input
+    #   -> a couple of containers
+    #   -> not much on the main tab.
+
+    at = AppTest.from_file(SCRIPT_UNDER_TEST, default_timeout=10).run()
+    verify_initial_session_state(at)
+
+    assert at.session_state.input_author_email == spoof_metadata.get("author_email")
+
+    # print (f"[I] whole tree: {at._tree}")
+    # for elem in at.sidebar.markdown:
+    #     print("\t", elem.value)
+
+    # do some basic checks on what is present in the sidebar
+    assert len(at.sidebar.divider) == 1
+    
+    # in the sidebar, we have the progress indicator, then the fileuploader and metadata inputs
+    # - annoyingly we can't use keys for markdown. 
+    # - so we are sensitive to the order. 
+    # - we could grab all the text, and just be content with presence of the target strings 
+    #   anywhere in the sidebar? that would be more robust at least.
+    assert "Progress: 0/5" in at.sidebar.markdown[0].value
+    assert "st-key-container_file_uploader_id" in at.sidebar.markdown[1].value
+    assert "st-key-container_metadata_inputs_id" in at.sidebar.markdown[2].value
+    assert "Metadata Inputs... wait for file upload" in at.sidebar.markdown[3].value
+
+    # there should be 1 input, for the author_email, in this path (no files uploaded)
+    assert len(at.sidebar.text_input) == 1
+    
+    # can't check for the presence of containers (they are st.Block elements in the tree)
+    # - no way to access the list of them, nor by key/id. nor by getter (unlike
+    #   images which seem to have an undocumented accessor, "imgs")
+    # best we can do is check that the session state ids exist, which is really basic but ok
+    assert "container_file_uploader" in at.session_state
+    assert "container_metadata_inputs" in at.session_state
+    # wow, the keys defined in the constructor are not honoured in session_state, unlike with
+    #   the text_input elements.  
+    #   code init -- st.container(border=True, key="container_file_uploader_id")
+    # so skip these ones for now. 
+    #   assert "container_file_uploader_id" in at.session_state
+    #   assert "container_metadata_inputs_id" in at.session_state
+    
+@pytest.mark.component
+@patch("streamlit.file_uploader")
+def test_two_input_files_realdata(mock_file_rv: MagicMock, mock_uploadedFile_List_ImageData):
+    # many test: list of 2 inputs
+    #   -> session state with 2 files
+    #   -> file_uploader with 2 files, ready to accept more
+    #   -> the metadata container will have two groups inside, with several input elements
+    #   -> the main tab will have a couple of text_area elements showing the uploaded file metadata
+
+    
+    # Create a list of 2 mock files
+    num_files = 2
+    mock_files = mock_uploadedFile_List_ImageData(num_files=num_files)
+    
+    # Set the return value of the mocked file_uploader to the list of mock files
+    mock_file_rv.return_value = mock_files
+
+    # Run the Streamlit app
+    at = AppTest.from_file(SCRIPT_UNDER_TEST, default_timeout=TIMEOUT).run()
+    verify_initial_session_state(at)
+
+    # put the mocked file_upload into session state, as if it were the result of a file upload, with the key 'file_uploader_data'
+    at.session_state["file_uploader_data"] = mock_files
+    # the side effect cant run until now (need file_uploader_data to be set)
+    mock_file_rv.side_effect = wrapped_buffer_uploaded_files
+
+    print(f"[I] session state: {at.session_state}")
+    at.run()
+    print(f"[I] session state: {at.session_state}")
+    print(f"full tree: {at._tree}")
+
+    verify_session_state_after_processing_files(at, num_files)
+
+    # and then there are plenty of visual elements, based on the image hashes.
+    for hash in at.session_state.image_hashes:
+        # check that each of the 4 inputs is present
+        assert at.sidebar.text_input(key=f"input_latitude_{hash}") is not None
+        assert at.sidebar.text_input(key=f"input_longitude_{hash}") is not None
+        assert at.sidebar.date_input(key=f"input_date_{hash}") is not None
+        assert at.sidebar.time_input(key=f"input_time_{hash}") is not None
+
+    if 'demo_input_sidebar' in SCRIPT_UNDER_TEST:
+        verify_metadata_in_demo_display(at, num_files)

tests/test_demo_multifile_upload.py

@@ -0,0 +1,282 @@
+from typing import Protocol, runtime_checkable
+
+from pathlib import Path
+from io import BytesIO
+from PIL import Image
+
+import pytest
+from unittest.mock import MagicMock, patch
+from streamlit.testing.v1 import AppTest
+
+# tests for apptest/demo_multifile_upload
+# - the functionality in the test harness is a file_uploader that is configured
+#   for multi-file input; and uses a callback to buffer the files into session state.
+#   - the handling of individual files includes extracting metadata from the files
+#   - a text_area is created for each file, to display the metadata extracted;
+#     this deviates from the presentation in the real app, but the extracted info 
+#     is the same (here we put it all in text which is far easier to validate using AppTest)
+# - the demo also has the author email input
+
+
+# zero test: no inputs -> empty session state 
+#  (or maybe even non-existent session state; for file_uploader we are not
+#  allowed to initialise the keyed variable, st borks)
+
+# many test: list of >=2 inputs -> session state with 2 files
+
+
+# for expectations
+from input.input_handling import spoof_metadata
+from input.input_validator import get_image_datetime, get_image_latlon
+
+
+@runtime_checkable
+class UploadedFile(Protocol):
+    name: str
+    size: int
+    type: str
+    #RANDO: str
+    _file_urls: list
+
+    def getvalue(self) -> bytes: ...
+    def read(self) -> bytes: ... 
+
+        
+class MockUploadedFile(BytesIO):
+    def __init__(self, 
+                 initial_bytes: bytes, 
+                 *, 
+                 name: str, 
+                 size: int, 
+                 type: str):
+        super().__init__(initial_bytes)
+        self.name = name  # Simulate a filename
+        self.size = size  # Simulate file size
+        self.type = type  # Simulate MIME type
+        self.file_id = None 
+
+
+@pytest.fixture
+def mock_uploadedFile():
+    def _mock_uploadedFile(name: str, size: int, type: str):
+        test_data = b'test data'
+        # now load some real data, if fname exists
+        base = Path(__file__).parent.parent
+        fname = Path(base / f"tests/data/{name}")
+        
+        if fname.exists():
+            with open(fname, 'rb') as f:
+                #test_data = BytesIO(f.read()) 
+                test_data = f.read()
+        else:
+            #print(f"[DDDD] {name}, {size}, {type} not found")
+            raise FileNotFoundError(f"file {fname} not found ({name}, {size}, {type})")
+    
+        return MockUploadedFile(
+                test_data, name=name, size=size, type=type,)
+    
+    return _mock_uploadedFile
+
+    
+@pytest.fixture
+def mock_uploadedFileNoRealData():
+    class MockGUIClassFakeData(MagicMock):
+        def __init__(self, *args, **kwargs):
+            super().__init__(*args, **kwargs)
+            name = kwargs.get('fname', 'image2.jpg')
+            size = kwargs.get('size', 123456)
+            type = kwargs.get('type', 'image/jpeg')
+            self.bytes_io = MockUploadedFile(
+                b"test data", name=name, size=size, type=type)
+            self.get_data = MagicMock(return_value=self.bytes_io)
+            # it seems unclear to me which member attributes get set by the MockUploadedFile constructor
+            # - for some reason, size and type get set, but name does not, and results in 
+            #   <MockGUIClass name='mock.name' id='<12345>'>.
+            #   so let's sjust explicitly set all the relevant attributes here.
+            self.name = name
+            self.size = size
+            self.type = type
+            
+    return MockGUIClassFakeData
+
+@pytest.fixture
+def mock_uploadedFile_List(mock_uploadedFileNoRealData):
+    def create_list_of_mocks(num_files=3, **kwargs):
+        return [mock_uploadedFileNoRealData(**kwargs) for _ in range(num_files)]
+    return create_list_of_mocks
+
+@pytest.fixture
+def mock_uploadedFile_List_ImageData(mock_uploadedFile):
+    def create_list_of_mocks_realdata(num_files=3, **kwargs):
+        print(f"[D] [mock_uploadedFile_List_Img-internal] num_files: {num_files}")
+        data = [
+            {"name": "cakes.jpg", "size": 1234, "type": "image/jpeg"},
+            {"name": "cakes_no_exif_datetime.jpg", "size": 12345, "type": "image/jpeg"},
+            {"name": "cakes_no_exif_gps.jpg", "size": 123456, "type": "image/jpeg"},
+        ]
+        
+        _the_files = []
+        for i in range(num_files):
+            _the_files.append( mock_uploadedFile(**data[i]))
+        
+        print(f"========== finished init of {num_files} mock_uploaded files | {len(_the_files)} ==========")
+        return _the_files
+            
+        #return [mock_uploadedFile(**kwargs) for _ in range(num_files)]
+    return create_list_of_mocks_realdata
+
+    
+# simple tests on the author email input via AppTest    
+# - empty input should propagate to session state
+# - invalid email should trigger an error
+def test_no_input_no_interaction():
+    with patch.dict(spoof_metadata, {"author_email": None}):
+        at = AppTest.from_file("src/apptest/demo_multifile_upload.py").run()
+        assert at.session_state.observations == {}
+        assert at.session_state.input_author_email == None
+
+    at = AppTest.from_file("src/apptest/demo_multifile_upload.py").run()
+    assert at.session_state.observations == {}
+    assert at.session_state.input_author_email == spoof_metadata.get("author_email")
+
+def test_bad_email():
+    with patch.dict(spoof_metadata, {"author_email": "notanemail"}):
+        at = AppTest.from_file("src/apptest/demo_multifile_upload.py").run()
+        assert at.session_state.input_author_email == "notanemail"
+        assert at.error[0].value == "Please enter a valid email address."
+    
+
+# test when we load real data files, with all properties as per real app
+# - if files loaded correctly and metadata is extracted correctly, we should see the
+#   the data in both the session state and in the visual elements.
+@patch("streamlit.file_uploader")
+def test_mockupload_list_realdata(mock_file_rv: MagicMock, mock_uploadedFile_List_ImageData):
+#def test_mockupload_list(mock_file_uploader_rtn: MagicMock, mock_uploadedFile_List):
+    num_files = 3
+    PRINT_PROPS = False
+    # Create a list of n mock files
+    mock_files = mock_uploadedFile_List_ImageData(num_files=num_files)
+    
+    # Set the return value of the mocked file_uploader to the list of mock files
+    mock_file_rv.return_value = mock_files
+
+    # Run the Streamlit app
+    at = AppTest.from_file("src/apptest/demo_multifile_upload.py").run()
+
+    # put the mocked file_upload into session state, as if it were the result of a file upload, with the key 'file_uploader_data'
+    at.session_state["file_uploader_data"] = mock_files
+
+    #print(f"[I] session state: {at.session_state}")
+    #print(f"[I] uploaded files: {at.session_state.file_uploader_data}")
+
+    if PRINT_PROPS:
+        print(f"[I] uploaded files: ({len(at.session_state.file_uploader_data)}) {at.session_state.file_uploader_data}")
+        for _f in at.session_state.file_uploader_data:
+            #print(f"\t[I]  props: {dir(_f)}")
+            print(f"  [I]  name: {_f.name}")
+            print(f"\t[I]  size: {_f.size}")
+            print(f"\t[I]  type: {_f.type}")
+            # lets make an image from the data
+            im = Image.open(_f)
+ 
+            # lets see what metadata we can get to.
+            dt = get_image_datetime(_f)
+            print(f"\t[I]  datetime: {dt}")
+            lat, lon = get_image_latlon(_f)
+            print(f"\t[I]  lat, lon: {lat}, {lon}")
+            
+            
+        # we expect to get the following info from the files
+        # file1:
+        # datetime: 2024:10:24 15:59:45
+        # lat, lon: 46.51860277777778, 6.562075
+        # file2:
+        # datetime: None
+        # lat, lon: 46.51860277777778, 6.562075
+
+        # let's run assertions on the backend data (session_state)
+        # and then on the front end too (visual elements)
+        f1 = at.session_state.file_uploader_data[0]
+        f2 = at.session_state.file_uploader_data[1]
+        
+        assert get_image_datetime(f1) == "2024:10:24 15:59:45"
+        assert get_image_datetime(f2) == None
+        # use a tolerance of 1e-6, assert that the lat, lon is close to 46.5186 
+        assert abs(get_image_latlon(f1)[0] - 46.51860277777778) < 1e-6
+        assert abs(get_image_latlon(f1)[1] - 6.562075) < 1e-6
+        assert abs(get_image_latlon(f2)[0] - 46.51860277777778) < 1e-6
+        assert abs(get_image_latlon(f2)[1] - 6.562075) < 1e-6
+        
+        # need to run the script top-to-bottom to get the text_area elements
+        # since they are dynamically created.
+        at.run()
+        
+        # since we uplaoded num_files files, hopefully we get num_files text areas 
+        assert len(at.text_area) == num_files
+        # expecting 
+        exp0 = "index: 0, name: cakes.jpg, datetime: 2024:10:24 15:59:45, lat: 46.51860277777778, lon:6.562075"
+        exp1 = "index: 1, name: cakes_no_exif_datetime.jpg, datetime: None, lat: 46.51860277777778, lon:6.562075"
+        exp2 = "index: 2, name: cakes_no_exif_gps.jpg, datetime: 2024:10:24 15:59:45, lat: None, lon:None"
+
+        assert at.text_area[0].value == exp0
+        assert at.text_area[1].value == exp1
+        if num_files >= 1:
+            assert at.text_area(key='metadata_0').value == exp0
+        if num_files >= 2:
+            assert at.text_area(key='metadata_1').value == exp1
+        if num_files >= 3:
+            assert at.text_area(key='metadata_2').value == exp2
+        
+        #    {"fname": "cakes.jpg", "size": 1234, "type": "image/jpeg"},
+        #    {"fname": "cakes_no_exif_datetime.jpg", "size": 12345, "type": "image/jpeg"},
+        #    {"fname": "cakes_no_exif_gps.jpg", "size": 123456, "type": "image/jpeg"},
+        #] 
+
+
+        # Verify the behavior in your app
+        assert len(at.session_state.file_uploader_data) == num_files
+       
+        assert at.session_state.file_uploader_data[0].size == 1234  # Check properties of the first file
+        assert at.session_state.file_uploader_data[1].name == "cakes_no_exif_datetime.jpg"
+
+
+# this test was a stepping stone; when I was mocking files that didn't have any real data
+# - it helped to explore how properties should be set in the mock object and generator funcs.
+@patch("streamlit.file_uploader")
+def test_mockupload_list(mock_file_uploader_rtn: MagicMock, mock_uploadedFile_List):
+    # Create a list of 2 mock files
+    mock_files = mock_uploadedFile_List(num_files=2, fname="test.jpg", size=100, type="image/jpeg")
+    
+    # Set the return value of the mocked file_uploader to the list of mock files
+    mock_file_uploader_rtn.return_value = mock_files
+
+    # Run the Streamlit app
+    at = AppTest.from_file("src/apptest/demo_multifile_upload.py").run()
+
+    # put the mocked file_upload into session state, as if it were the result of a file upload, with the key 'file_uploader_data'
+    at.session_state["file_uploader_data"] = mock_files
+
+    #print(f"[I] session state: {at.session_state}")
+    #print(f"[I] uploaded files: {at.session_state.file_uploader_data}")
+
+    if 1:
+        print(f"[I] uploaded files: {at.session_state.file_uploader_data}")
+        for _f in at.session_state.file_uploader_data:
+            print(f"[I]  props: {dir(_f)}")
+            print(f"[I]  name: {_f.name}")
+            print(f"[I]  size: {_f.size}")
+            print(f"[I]  type: {_f.type}")
+            print(f"[I] data : {type(_f)} | {type(_f.return_value)} | {_f}")
+            # lets make an image from it.
+            #im = Image.open(_f)
+            
+
+            
+
+
+        # Verify behavior in the app
+        assert len(at.session_state.file_uploader_data) == 2
+        
+        assert at.session_state.file_uploader_data[0].size == 100  # Check properties of the first file
+        assert at.session_state.file_uploader_data[1].name == "test.jpg"  # Check properties of the second file
+

tests/test_input_observation.py

@@ -0,0 +1,422 @@
+from typing import Protocol, runtime_checkable
+import pytest
+from unittest.mock import MagicMock, patch
+
+from io import BytesIO
+#from PIL import Image
+import datetime
+import numpy as np
+    
+#from streamlit.runtime.uploaded_file_manager import UploadedFile # for type hinting
+#from typing import List, Union
+
+from input.input_observation import InputObservation
+
+@runtime_checkable
+class UploadedFile(Protocol):
+    name: str
+    size: int
+    type: str
+    _file_urls: list
+
+    def getvalue(self) -> bytes: ...
+    def read(self) -> bytes: ... 
+
+
+class MockUploadedFile(BytesIO):
+    def __init__(self, 
+                 initial_bytes: bytes,
+                 *, # enforce keyword-only arguments after now
+                 name:str,
+                 size:int,
+                 type:str): 
+        #super().__init__(*args, **kwargs)
+        super().__init__(initial_bytes)
+        self.name = name 
+        self.size = size
+        self.type = type
+        
+        self._file_urls = [None,]
+
+
+@pytest.fixture
+def mock_uploadedFile():
+    class MockGUIClass(MagicMock):
+        def __init__(self, *args, **kwargs):
+            super().__init__(*args, **kwargs)
+            name = kwargs.get('name', 'image2.jpg')
+            size = kwargs.get('size', 123456)
+            type = kwargs.get('type', 'image/jpeg')
+            self.bytes_io = MockUploadedFile(
+                b"test data", name=name, size=size, type=type)
+            self.get_data = MagicMock(return_value=self.bytes_io)
+    return MockGUIClass
+
+
+# let's first generate a test for the mock_uploaded_file  and MockUploadedFile class
+# - test with valid input
+def test_mock_uploaded_file(mock_uploadedFile):
+    # setup values for the test (all valid)
+    image_name = "test_image.jpg"
+    mock_file = mock_uploadedFile(name=image_name).get_data()
+    
+    #print(dir(mock_file))
+    assert isinstance(mock_file, BytesIO)
+
+    assert mock_file.name == image_name
+    assert mock_file.size == 123456
+    assert mock_file.type == "image/jpeg"
+
+
+# now we move on to test the class InputObservation
+# - with valid input
+# - with invalid input
+# - with missing input
+
+def test_input_observation_valid(mock_uploadedFile):
+    # image: ndarray
+    # lat, lon: float
+    # author_email: str
+    # date, time: datetime.date, datetime.time
+    #uploaded_file: UploadedFile (need to mock this)
+    # image_md5: str
+
+    # setup values for the test (all valid)
+
+    author_email = "[email protected]"
+    image_name = "test_image.jpg"
+    mock_file = mock_uploadedFile(name=image_name).get_data()
+    
+    _date="2023-10-10"
+    _time="10:10:10"
+    image_datetime_raw = _date + " " + _time
+    dt = datetime.datetime.strptime(image_datetime_raw, "%Y-%m-%d %H:%M:%S")
+    date = dt.date()    
+    time = dt.time()
+
+    ## make a random image with dtype uint8 using np.random.randint
+    image = np.random.randint(0, 255, (100, 100, 3), dtype=np.uint8)
+    image_md5 = 'd1d2515e6f6ac4c5ca6dd739d5143cd4' # 32 hex chars.
+    
+    obs = InputObservation(
+        image=image, 
+        latitude=12.34, longitude=56.78, author_email=author_email,
+        time=time, date=date,
+        uploaded_file=mock_file,
+        image_md5=image_md5,
+        )
+    
+    assert isinstance(obs.image, np.ndarray)
+    assert (obs.image == image).all()
+    
+    assert obs.latitude == 12.34
+    assert obs.longitude == 56.78
+    assert obs.author_email == author_email
+    assert isinstance(obs.date, datetime.date)
+    assert isinstance(obs.time, datetime.time)
+    assert str(obs.date) == "2023-10-10"
+    assert str(obs.time) == "10:10:10"
+
+    assert obs.uploaded_file.name == image_name
+    assert obs.uploaded_file.size == 123456
+    assert obs.uploaded_file.type == "image/jpeg"
+    
+    assert isinstance(obs.uploaded_file, BytesIO)
+    #assert isinstance(obs.uploaded_file, MockUploadedFile) # is there any point in checking the type of the mock, ?
+
+
+# a list of tuples (strings that are the keys of "valid_inputs", expected error type)
+# loop over the list, and for each tuple, create a dictionary with all valid inputs, and one invalid input
+# assert that the function raises the expected error type
+
+invalid_input_scenarios = [ 
+            ("author_email", TypeError),
+            ("image_name", TypeError),
+            ("uploaded_file", TypeError),
+            ("date", TypeError),
+            ("time", TypeError),
+            ("image", TypeError),
+            ("image_md5", TypeError),
+    ]
+
+@pytest.mark.parametrize("key, error_type", invalid_input_scenarios)
+def test_input_observation_invalid(key, error_type, mock_uploadedFile):
+    # correct datatypes are:
+    # - image: ndarray
+    # - lat, lon: float
+    # - author_email: str
+    # - date, time: datetime.date, datetime.time
+    # - uploaded_file: UploadedFile (need to mock this)
+    # - image_md5: str
+
+    # the most critical/likely to go wrong would presumably be 
+    # - date, time (strings not datetime objects)
+    # - lat, lon (strings not numbers)
+    # - image (not ndarray, maybe accidentally a PIL object or maybe the filename)
+    # - uploaded_file (not UploadedFile, maybe a string, or maybe the ndarray)
+
+    # check it fails when any of the datatypes are wrong,
+    # even if the rest are all good want to loop over the inputs, take each one
+    # from a bad list, and all others from a good list, and assert fails for
+    # each one
+    
+    # set up the good and bad inputs
+    _date="2023-10-10"
+    _time="10:10:10"
+    image_datetime_raw = _date + " " + _time
+    fname = "test_image.jpg"
+    image = np.random.randint(0, 255, (100, 100, 3), dtype=np.uint8)
+    
+    dt_ok = datetime.datetime.strptime(image_datetime_raw, "%Y-%m-%d %H:%M:%S")
+    valid_inputs = {
+        "author_email": "[email protected]",
+        "image_name": "test_image.jpg",
+        "uploaded_file": mock_uploadedFile(name=fname).get_data(),
+        "date": dt_ok.date(),
+        "time": dt_ok.time(),
+        "image": image,
+        "image_md5": 'd1d2515e6f6ac4c5ca6dd739d5143cd4', # 32 hex chars.
+    }
+    invalid_inputs = {
+        "author_email": "@example",
+        "image_name": 45,
+        "uploaded_file": image,
+        "date": _date,
+        "time": _time,
+        "image": fname,
+        "image_md5": 45643
+    }
+
+    # test a valid set of inputs, minus the target key, substituted for something invalid
+    inputs = valid_inputs.copy()
+    inputs[key] = invalid_inputs[key]
+    
+    with pytest.raises(error_type):
+        obs = InputObservation(**inputs)
+    
+    # now test the same key set to None 
+    inputs = valid_inputs.copy()
+    inputs[key] = None
+    with pytest.raises(error_type):
+        obs = InputObservation(**inputs)
+    
+
+# we can take a similar approach to test equality. 
+# here, construct two dicts, each with valid inputs but all elements different.
+# loop over the keys, and construct two InputObservations that differ on that key only.
+# asser the expected output message.
+# ah, it is the diff func that prints a message. Here we just assert boolean.
+
+# we currently expect differences on time to be ignored. 
+inequality_keys = [
+    ("author_email", False),
+    ("uploaded_file", False),
+    ("date", False),
+    #("time", True),
+    pytest.param("time", False, marks=pytest.mark.xfail(reason="Time is currently ignored in __eq__")),
+    ("image", False),
+    ("image_md5", False),
+]
+@pytest.mark.parametrize("key, expect_equality", inequality_keys)
+def test_input_observation_equality(key, expect_equality, mock_uploadedFile):
+
+    # set up the two sets of good inputs
+    _date1 = "2023-10-10"
+    _time1 = "10:10:10"
+    image_datetime_raw1 = _date1 + " " + _time1
+    fname1 = "test_image.jpg"
+    image1 = np.random.randint(0, 255, (100, 100, 3), dtype=np.uint8)
+    dt1 = datetime.datetime.strptime(image_datetime_raw1, "%Y-%m-%d %H:%M:%S")
+
+    _date2 = "2023-10-11"
+    _time2 = "12:13:14"
+    image_datetime_raw2 = _date2 + " " + _time2
+    fname2 = "test_image.jpg"
+    image2 = np.random.randint(0, 255, (100, 100, 3), dtype=np.uint8)
+    dt2 = datetime.datetime.strptime(image_datetime_raw2, "%Y-%m-%d %H:%M:%S")
+    valid_inputs1 = {
+        "author_email": "[email protected]",
+        #"image_name": "test_image.jpg",
+        "uploaded_file": mock_uploadedFile(name=fname1).get_data(),
+        "date": dt1.date(),
+        "time": dt1.time(),
+        "image": image1,
+        "image_md5": 'd1d2515e6f6ac4c5ca6dd739d5143cd4', # 32 hex chars.
+    }
+
+    valid_inputs2 = {
+        "author_email": "[email protected]",
+        #"image_name": "another.jpg",
+        "uploaded_file": mock_uploadedFile(name=fname2).get_data(),
+        "date": dt2.date(),
+        "time": dt2.time(),
+        "image": image2,
+        "image_md5": 'cdb235587bdee5915d6ccfa52ca9f3ac', # 32 hex chars.
+    }
+
+    nearly_same_inputs = valid_inputs1.copy()
+    nearly_same_inputs[key] = valid_inputs2[key]
+    obs1 = InputObservation(**valid_inputs1)
+    obs2 = InputObservation(**nearly_same_inputs)
+
+    if expect_equality is True:
+        assert obs1 == obs2
+    else:
+        assert obs1 != obs2
+    
+
+# now let's test the setter methods (set_top_predictions, set_selected_class, set_class_overriden)
+# ideally we get a fixture that produces a good / valid InputObservation object
+# and from there, just test the setters + their expected changes / side effects
+
+@pytest.fixture
+def good_datadict_for_input_observation(mock_uploadedFile) -> dict:
+    # set up the good and bad inputs
+    _date="2023-10-10"
+    _time="10:10:10"
+    image_datetime_raw = _date + " " + _time
+    fname = "test_image.jpg"
+    image = np.random.randint(0, 255, (100, 100, 3), dtype=np.uint8)
+    
+    dt_ok = datetime.datetime.strptime(image_datetime_raw, "%Y-%m-%d %H:%M:%S")
+    valid_inputs = {
+        "author_email": "[email protected]",
+        "uploaded_file": mock_uploadedFile(name=fname).get_data(),
+        "date": dt_ok.date(),
+        "time": dt_ok.time(),
+        "image": image,
+        "image_md5": 'd1d2515e6f6ac4c5ca6dd739d5143cd4', # 32 hex chars.
+        "image_datetime_raw": image_datetime_raw,
+        "latitude": 12.34, 
+        "longitude": 56.78,
+    
+    }
+    return valid_inputs
+    
+
+@pytest.fixture
+def good_input_observation(good_datadict_for_input_observation) -> InputObservation:
+    observation = InputObservation(**good_datadict_for_input_observation)
+
+    return observation
+    
+
+# 
+def test_input_observation__set_top_predictions_populated(good_input_observation):
+    obs = good_input_observation
+    
+    # before setting, expect empty list
+    assert obs.top_predictions == []
+    assert obs.selected_class == None
+    
+    # set >0, 
+    # - expect to find the same list in the property/attribute
+    # - expect to find the first element in the selected_class
+    top_predictions = ["beluga", "blue_whale", "common_dolphin"]
+    obs.set_top_predictions(top_predictions)
+
+    assert len(obs.top_predictions) == 3
+    assert obs.top_predictions == top_predictions
+    assert obs.selected_class == "beluga"
+    
+def test_input_observation__set_top_predictions_unpopulated(good_input_observation):
+    obs = good_input_observation
+    
+    # before setting, expect empty list
+    assert obs.top_predictions == []
+    assert obs.selected_class == None
+    
+    # set to empty list,
+    # - expect to find the same list in the property/attribute
+    # - expect to find selected_class to be None
+    top_predictions = []
+    obs.set_top_predictions(top_predictions)
+
+    assert len(obs.top_predictions) == 0
+    assert obs.top_predictions == []
+    assert obs.selected_class == None
+    
+def test_input_observation__set_selected_class_default(good_input_observation):
+    obs = good_input_observation
+    
+    # before setting, expect empty list
+    assert obs.top_predictions == []
+    assert obs.selected_class == None
+    assert obs.class_overriden == False
+    
+    # set >0, and then set_selected_class to the first element 
+    # - expect to find the same list in the property/attribute
+    # - expect to find the first element in the selected_class
+    # - expect class_overriden to be False
+    top_predictions = ["beluga", "blue_whale", "common_dolphin"]
+    obs.set_top_predictions(top_predictions)
+    obs.set_selected_class(top_predictions[0])
+
+    assert len(obs.top_predictions) == 3
+    assert obs.top_predictions == top_predictions
+    assert obs.selected_class == "beluga" 
+   
+def test_input_observation__set_selected_class_override(good_input_observation):
+    obs = good_input_observation
+    
+    # before setting, expect empty list
+    assert obs.top_predictions == []
+    assert obs.selected_class == None
+    assert obs.class_overriden == False
+    
+    # set >0, and then set_selected_class to something out of list
+    # - expect to find the same list in the property/attribute
+    # - expect to find the first element in the selected_class
+    # - expect class_overriden to be False
+    top_predictions = ["beluga", "blue_whale", "common_dolphin"]
+    obs.set_top_predictions(top_predictions)
+    obs.set_selected_class("brydes_whale")
+
+    assert len(obs.top_predictions) == 3
+    assert obs.top_predictions == top_predictions
+    assert obs.selected_class == "brydes_whale"
+    assert obs.class_overriden == True
+    
+   
+# now we want to test to_dict, make sure it is compliant with the data to be
+# transmitted to the dataset/server 
+
+def test_input_observation_to_dict(good_datadict_for_input_observation):
+    obs = InputObservation(**good_datadict_for_input_observation)
+    
+    # set >0, and then set_selected_class to something out of list
+    # - expect to find the same list in the property/attribute
+    # - expect to find the first element in the selected_class
+    # - expect class_overriden to be False
+    top_predictions = ["beluga", "blue_whale", "common_dolphin"]
+    selected = "brydes_whale"
+    obs.set_top_predictions(top_predictions)
+    obs.set_selected_class(selected)
+    
+    # as a first point, we expect the dict to be like the input dict...
+    expected_output = good_datadict_for_input_observation.copy()
+    # ... with a few changes
+    # - date and time get converted to str(date) str(time)
+    expected_output["date"] = str(expected_output["date"])
+    expected_output["time"] = str(expected_output["time"])
+    # - image_filename comes from uploaded_file.name
+    expected_output["image_filename"] = expected_output["uploaded_file"].name
+    # - uploaded_file and image are not in the transmitted data
+    del expected_output["uploaded_file"]
+    del expected_output["image"]
+    # - the classification results should be as set above
+    expected_output["top_prediction"] = top_predictions[0]
+    expected_output["selected_class"] = selected
+    expected_output["class_overriden"] = True
+    
+    print(obs.to_dict())
+    assert obs.to_dict() == expected_output
+    
+    # expected = {
+    #     'image_filename': 'test_image.jpg', 'image_md5':
+    #     'd1d2515e6f6ac4c5ca6dd739d5143cd4', 'latitude': 12.34, 'longitude':
+    #     56.78, 'author_email': '[email protected]', 'image_datetime_raw':
+    #     '2023-10-10 10:10:10', 'date': '2023-10-10', 'time': '10:10:10',
+    #     'selected_class': 'brydes_whale', 'top_prediction': 'beluga',
+    #     'class_overriden': True
+    #     }

tests/test_input_validator.py

@@ -0,0 +1,21 @@
+import pytest
+from input.input_validator import generate_random_md5
+
+def test_generate_random_md5_length():
+    md5_hash = generate_random_md5(16)
+    assert len(md5_hash) == 32, "MD5 hash length should be 32 characters"
+
+def test_generate_random_md5_uniqueness():
+    md5_hash1 = generate_random_md5(16)
+    md5_hash2 = generate_random_md5(16)
+    assert md5_hash1 != md5_hash2, "MD5 hashes should be unique for different random strings"
+
+def test_generate_random_md5_default_length():
+    md5_hash = generate_random_md5()
+    assert len(md5_hash) == 32, "MD5 hash length should be 32 characters when using default length"
+
+def test_generate_random_md5_different_data_lengths():
+    md5_hash_8 = generate_random_md5(8)
+    md5_hash_32 = generate_random_md5(32)
+    assert len(md5_hash_8) == 32, "MD5 hash length should be 32 characters for 8 character input"
+    assert len(md5_hash_32) == 32, "MD5 hash length should be 32 characters for 32 character input"

tests/test_main.py

@@ -0,0 +1,298 @@
+import pytest
+from unittest.mock import MagicMock, patch
+from streamlit.testing.v1 import AppTest
+import time
+
+from input.input_handling import spoof_metadata
+from input.input_observation import InputObservation
+from input.input_handling import buffer_uploaded_files
+
+from streamlit.runtime.uploaded_file_manager import UploadedFile
+from numpy import ndarray
+
+from test_demo_multifile_upload import (
+    mock_uploadedFile_List_ImageData, mock_uploadedFile,
+    MockUploadedFile, )
+
+
+from test_demo_input_sidebar import (
+    verify_initial_session_state, verify_session_state_after_processing_files, 
+    wrapped_buffer_uploaded_files_allowed_once)
+
+from test_demo_input_sidebar import _cprint, OKBLUE, OKGREEN, OKCYAN, FAIL, PURPLE
+
+TIMEOUT = 30
+SCRIPT_UNDER_TEST = "src/main.py"
+
+def debug_check_images(at:AppTest, msg:str=""):
+    _cprint(f"[I] num images in session state {msg}: {len(at.session_state.images)}", OKCYAN)
+    for i, (key, img) in enumerate(at.session_state.images.items()):
+    #for i, img in enumerate(at.session_state.images.values()):
+        #assert isinstance(img, ndarray)
+        if isinstance(img, ndarray):
+            print(f"image {i}: {img.shape} [{key}]")
+        else:
+            print(f"image {i}: {type(img)} [{key}]")    
+
+def nooop(*args, **kwargs):
+    _cprint("skipping the buffering -- shoul only happen once", FAIL)
+    raise RuntimeError
+    pass
+
+@pytest.mark.end2end
+@pytest.mark.slow
+@patch("streamlit.file_uploader")
+def test_click_validate_after_data_entry(mock_file_rv: MagicMock, mock_uploadedFile_List_ImageData):
+    # this test goes through several stages of the workflow
+    # 
+    
+    # 1. get app started 
+    
+    # first we need to upload >0 files
+    num_files = 2
+    mock_files = mock_uploadedFile_List_ImageData(num_files=num_files)
+    mock_file_rv.return_value = mock_files
+    
+    t0 = time.time()
+    at = AppTest.from_file(SCRIPT_UNDER_TEST, default_timeout=TIMEOUT).run()
+    t1 = time.time()
+    _cprint(f"[T] time to load: {t1-t0:.2f}s", PURPLE)
+    verify_initial_session_state(at)
+
+    # 1-Test: at this initial state, we expect:
+    # - the workflow state is 'doing_data_entry'
+    # - the validate button is disabled
+    # - the infer button (on main tab) is disabled
+    #   - note: props of the button: label, value, proto, disabled. 
+    #     don't need to check others here
+
+    assert at.session_state.workflow_fsm.current_state == 'doing_data_entry'
+    assert at.sidebar.button[1].disabled == True
+    infer_button = at.tabs[0].button[0]
+    assert infer_button.disabled == True 
+
+
+    # 2. upload files, and trigger the callback
+
+    # put the mocked file_upload into session state, as if it were the result of a file upload, with the key 'file_uploader_data'
+    at.session_state["file_uploader_data"] = mock_files
+    # the side effect cant run until now (need file_uploader_data to be set)
+    if wrapped_buffer_uploaded_files_allowed_once.called == 0:
+        mock_file_rv.side_effect = wrapped_buffer_uploaded_files_allowed_once
+    else:
+        mock_file_rv.side_effect = nooop
+        
+    _cprint(f"[I] buffering called {wrapped_buffer_uploaded_files_allowed_once.called} times", OKGREEN)
+
+    t2 = time.time()
+    at.run()
+    t3 = time.time()    
+    _cprint(f"[T] time to run with file processing: {t3-t2:.2f}s", PURPLE)
+    
+    # 2-Test: after uploading the files, we should have:
+    # - the workflow state moved on to 'data_entry_complete'
+    # - several changes applied to the session_state (handled by verify_session_state_after_processing_files)
+    # - the validate button is enabled
+    # - the infer button is still disabled
+    
+    verify_session_state_after_processing_files(at, num_files)
+    debug_check_images(at, "after processing files")
+    _cprint(f"[I] buffering called {wrapped_buffer_uploaded_files_allowed_once.called} times", OKGREEN)
+
+    assert at.session_state.workflow_fsm.current_state == 'data_entry_complete'
+
+    assert at.sidebar.button[1].disabled == False
+    infer_button = at.tabs[0].button[0]
+    assert infer_button.disabled == True 
+
+    print(at.markdown[0])
+
+    # 3. data entry complete, click the validate button
+    at.sidebar.button[1].click().run()
+    t4 = time.time()
+    _cprint(f"[T] time to run step 3: {t4-t3:.2f}s", PURPLE)
+
+    # 3-Test: after validating the data, we should have:
+    # - the state (backend) should move to data_entry_validated
+    # - the UI should show the new state (in sidebar.markdown[0])
+    # - the infer button should now be enabled
+    # - the validate button should be disabled
+    
+    assert at.session_state.workflow_fsm.current_state == 'data_entry_validated'
+    assert "data_entry_validated" in at.sidebar.markdown[0].value 
+    
+    # TODO: this part of the test currently fails because hte main code doesn't
+    # change the button; in this exec path/branch, the button is not rendered at all.
+    # so if we did at.run() after the click, the button is absent entierly! 
+    # If we don't run, the button is still present in its old state (enabled)
+    # for btn in at.sidebar.button:
+    #     print(f"button: {btn.label} {btn.disabled}")
+    # #assert at.sidebar.button[1].disabled == True
+
+    infer_button = at.tabs[0].button[0]
+    assert infer_button.disabled == False 
+    
+    debug_check_images(at, "after validation button")
+    _cprint(f"[I] buffering called {wrapped_buffer_uploaded_files_allowed_once.called} times", OKGREEN)
+
+    # # at this point, we want to retrieve the main area, get the tabs child, 
+    # # and then on the first tab get the first button & check not disabled (will click next step)
+    # #print(at._tree)
+    # # fragile: assume the first child is 'main'
+    # # robust: walk through children until we find the main area
+    # # main_area = at._tree.children[0]
+    # # main_area = None
+    # # for _id, child in at._tree.children.items():
+    # #     if child.type == 'main':
+    # #         main_area = child
+    # #         break
+    # # assert main_area is not None
+
+    # # ah, we can go direct to the tabs. they are only plausible in main. (not supported in sidebar)
+    # infer_tab = at.tabs[0]
+    # #print(f"tab: {infer_tab}")
+    # #print(dir(infer_tab))
+    # btn = infer_tab.button[0]
+    # print(f"button: {btn}")
+    # print(btn.label)
+    # print(btn.disabled) 
+
+    # infer_button = at.tabs[0].button[0]
+    # assert infer_button.disabled == False
+
+    # check pre-ML click that we are ready for it.
+
+    debug_check_images(at, "before clicking infer. ")
+    _cprint(f"[I] buffering called {wrapped_buffer_uploaded_files_allowed_once.called} times", OKGREEN)
+    TEST_ML = True
+    SKIP_CHECK_OVERRIDE = False
+    # 4. launch ML inference by clicking the button
+    if TEST_ML:
+        # infer_button = at.tabs[0].button[0]
+        # assert infer_button.disabled == False
+        # now test the ML step
+        infer_button.click().run()
+        t5 = time.time()
+        _cprint(f"[T] time to run step 4: {t5-t4:.2f}s", PURPLE)
+
+        # 4-Test: after clicking the infer button, we should have:
+        # - workflow should have moved on to 'ml_classification_completed'
+        # - the main tab button should now have new text (confirm species predictions)
+        # - we should have the results presented on the main area
+        #   - 2+6 image elements (the source image, images of 3 predictions) * num_files
+        #   - 2 dropdown elements (one for each image) + 1 for the page selector
+        #   - all of the observations should have class_overriden == False
+
+        assert at.session_state.workflow_fsm.current_state == 'ml_classification_completed'
+        # check the observations
+        for i, obs in enumerate(at.session_state.observations.values()):
+            print(f"obs {i}: {obs}")
+            assert isinstance(obs, InputObservation)
+            assert obs.class_overriden == False
+
+        # check the visual elements
+        infer_tab = at.tabs[0]
+        print(f"tab: {infer_tab}")  
+        img_elems = infer_tab.get("imgs")
+        print(f"imgs: {len(img_elems)}")
+        assert len(img_elems) == num_files*4
+
+        infer_button = infer_tab.button[0]
+        assert infer_button.disabled == False
+        assert 'Confirm species predictions' in infer_button.label
+
+        # we have 1 per file, and also one more to select the page of results being shown.
+        # - hmm, so we aren't going to see the right number if it goes multipage :(
+        # - but this test specifically uses 2 inputs. 
+        assert len(infer_tab.selectbox) == num_files + 1 
+        
+        
+        # 5. manually override the class of one of the observations
+        idx_to_override = 1  # don't forget, we also have the page selector first.
+        infer_tab.selectbox[idx_to_override + 1].select_index(20).run()  # FRAGILE!
+            
+        # 5-TEST. 
+        # - expect that all class_overriden are False, except for the one we just set
+        # - also expect there still to be num_files*4 images (2+6 per file) etc
+        for i, obs in enumerate(at.session_state.observations.values()):
+            _cprint(f"obs {i}: {obs.class_overriden} {obs.to_dict()}", OKBLUE)
+            assert isinstance(obs, InputObservation)
+            if not SKIP_CHECK_OVERRIDE:
+                if i == idx_to_override:
+                    assert obs.class_overriden == True
+                else:
+                    assert obs.class_overriden == False
+                
+        # 6. confirm the species predictions, get ready to allow upload
+        infer_tab = at.tabs[0]
+        confirm_button = infer_tab.button[0]
+        confirm_button.click().run()
+        t6 = time.time()
+        _cprint(f"[T] time to run step 5: {t6-t5:.2f}s", PURPLE)
+        
+        # 6-TEST. Now we expect to see: 
+        # - the workflow state should be 'manual_inspection_completed'
+        # - the obsevations should be as per the previous step
+        # - the main tab button should now have new text (Upload all observations)
+        # - we should have 4n images
+        # - we should have only 1 select box (page), (passed stage for overriding class)
+        
+        assert at.session_state.workflow_fsm.current_state == 'manual_inspection_completed'
+        for i, obs in enumerate(at.session_state.observations.values()):
+            _cprint(f"obs {i}: {obs.class_overriden} {obs.to_dict()}", OKBLUE)
+            assert isinstance(obs, InputObservation)
+            if not SKIP_CHECK_OVERRIDE:
+                if i == idx_to_override:
+                    assert obs.class_overriden == True
+                else:
+                    assert obs.class_overriden == False
+        
+        # we have to trigger a manual refresh? no, it seems that sometimes the tests fail, maybe 
+        #   because the script is slow? it is not unique to here, various points that usually pass
+        #   occasionally fail because elements haven't yet been drawn. I suppose the timing aspect 
+        #   internally by AppTest is not perfect (selenium has moved from explicit to implicit waits,
+        #   though I didn't look too deeply whether apptest also has an explicit wait mechanism)
+        # # time.sleep(1)
+        # #at.run()
+        infer_tab = at.tabs[0]
+        upload_button = infer_tab.button[0]
+        assert upload_button.disabled == False
+        assert 'Upload all observations' in upload_button.label
+        
+        img_elems = infer_tab.get("imgs")
+        assert len(img_elems) == num_files*4
+        
+        assert len(infer_tab.selectbox) == 1 
+        
+        # 7. upload the observations
+        upload_button.click().run()
+        t7 = time.time()
+        _cprint(f"[T] time to run step 6: {t7-t6:.2f}s", PURPLE)
+
+        # 7-TEST. Now we expect to see:
+        # - workflow state should be 'data_uploaded'
+        # - nothing else in the back end should have changed (is that a mistake? should we 
+        #   add a boolean tracking if the observations have been uploaded?)
+        # - a toast presented for each observation uploaded
+        # - the images should still be there, and 1 select box (page)
+        # - no more button on the main area
+        
+        assert at.session_state.workflow_fsm.current_state == 'data_uploaded'
+        #print(at.toast)
+        assert len(at.toast) == num_files
+        infer_tab = at.tabs[0]
+        
+        img_elems = infer_tab.get("imgs")
+        assert len(img_elems) == num_files*4
+        assert len(infer_tab.selectbox) == 1 
+        assert len(infer_tab.button) == 0   
+        
+        
+        
+        
+        
+        
+            
+        
+
+

tests/visual_selenium/requirements_visual.txt

@@ -0,0 +1,5 @@
+# visual tests with selenium
+selenium~=4.27.1
+seleniumbase~=4.33.12
+
+pytest~=8.3.4

tests/visual_selenium/test_visual_main.py

@@ -0,0 +1,288 @@
+from pathlib import Path
+import time
+from contextlib import contextmanager
+
+import pytest
+from seleniumbase import BaseCase
+from selenium.webdriver.common.by import By
+from selenium.webdriver.support.ui import WebDriverWait
+from selenium.webdriver.support import expected_conditions as EC
+
+
+BaseCase.main(__name__, __file__)
+
+# Set the paths to the images and csv file
+repo_path = Path(__file__).resolve().parents[2]
+imgpath = repo_path / "tests/data/rand_images"
+img_f1 = imgpath / "img_001.jpg"
+img_f2 = imgpath / "img_002.jpg"
+img_f3 = imgpath / "img_003.jpg"
+#csvpath = repo_path / "tests/data/test_csvs"
+#csv_f1 = csvpath / "debian.csv"
+
+mk_visible = """
+            var input = document.querySelector('[data-testid="stFileUploaderDropzoneInput"]');
+            input.style.display = 'block';
+            input.style.opacity = '1';
+            input.style.visibility = 'visible';
+            """
+
+PORT = "8501" 
+
+# - _before_module and run_streamlit taken from 
+#   https://github.com/randyzwitch/streamlit-folium/blob/master/tests/test_frontend.py 
+#   example given via streamlit blog
+# - note: to use pytest fixtures x unittest we have to use autouse=True. 
+@pytest.fixture(scope="module", autouse=True)
+def _before_module():
+    # Run the streamlit app before each module
+    with run_streamlit():
+        yield
+
+@contextmanager
+def run_streamlit():
+    """Run the streamlit app at src/main.py on port PORT"""
+
+    import subprocess
+
+    p = subprocess.Popen(
+        [
+            "streamlit",
+            "run",
+            "src/main.py",
+            "--server.port",
+            PORT,
+            "--server.headless",
+            "true",
+        ]
+    )
+
+    time.sleep(5)
+
+    try:
+        yield 1
+    finally:
+        p.kill()
+
+def wait_for_element(self, by, selector, timeout=10):
+    # example usage:
+    # element = self.wait_for_element(By.XPATH, "//p[contains(text(), 'Species for observation')]")
+    
+    return WebDriverWait(self.driver, timeout).until(
+        EC.presence_of_element_located((by, selector))
+    )
+
+
+def find_all_button_paths(self):
+    buttons = self.find_elements("button")
+    for button in buttons:
+        print(f"\nButton found:")
+        print(f"Text: {button.text.strip()}")
+        print(f"HTML: {button.get_attribute('outerHTML')}")
+        print("-" * 50)
+
+def check_columns_and_images(self, exp_cols:int, exp_imgs:int=4):
+    # Find all columns
+    columns = self.find_elements("div[class*='stColumn']")
+    
+    # Check number of columns 
+    assert len(columns) == exp_cols, f"Expected exp_cols columns but found {len(columns)}"
+    
+    # Check images in each column
+    for i, column in enumerate(columns, 1):
+        # Find all images within this column's image containers
+        images = self.find_elements(
+            f"div[class*='stColumn']:nth-child({i}) div[data-testid='stImageContainer'] img"
+        )
+        
+        # Check number of images in this column 
+        assert len(images) == exp_imgs, f"Column {i} has {len(images)} images instead of {exp_imgs}"
+
+
+def analyze_species_columns_debug(self):
+    # First, just try to find any divs
+    all_divs = self.find_elements(By.TAG_NAME, "div")
+    print(f"Found {len(all_divs)} total divs")
+
+    # Then try to find stColumn divs
+    column_divs = self.find_elements(By.XPATH, "//div[contains(@class, 'stColumn')]")
+    print(f"Found {len(column_divs)} column divs")
+
+    # Try to find any elements containing our text, without class restrictions
+    text_elements = self.find_elements(
+        By.XPATH, "//*[contains(text(), 'Species for observation')]"
+    )
+    print(f"Found {len(text_elements)} elements with 'Species for observation' text")
+
+    # If we found text elements, print their tag names and class names to help debug
+    for elem in text_elements:
+        print(f"Tag: {elem.tag_name}, Class: {elem.get_attribute('class')}")
+
+def analyze_species_columns(self, exp_cols:int, exp_imgs:int=4, exp_visible:bool=True):
+    # Find all columns that contain the specific text pattern
+    cur_tab = get_selected_tab(self)
+    print(f"Current tab: {cur_tab['text']} ({cur_tab['id']})" )
+    
+    #"div[class*='stColumn']//div[contains(text(), 'Species for observation')]"
+    spec_labels = self.find_elements(
+        By.XPATH, 
+        "//p[contains(text(), 'Species for observation')]"
+    )
+    
+    # This gets us the text containers, need to go back up to the column
+    species_columns = [lbl.find_element(By.XPATH, "./ancestor::div[contains(@class, 'stColumn')]") 
+                      for lbl in spec_labels]
+     
+    print(f"   Found {len(species_columns)} species columns (total {len(spec_labels)} species labels)")
+    assert len(species_columns) == exp_cols, f"Expected {exp_cols} columns but found {len(species_columns)}"
+    
+    
+    for i, column in enumerate(species_columns, 1):
+        # Get the species number text
+        species_text = column.find_element(
+            #By.XPATH, ".//div[contains(text(), 'Species for observation')]"
+            By.XPATH, ".//p[contains(text(), 'Species for observation')]"
+        )
+        print(f"   Analyzing col {i}:{species_text.text} {species_text.get_attribute('outerHTML')} | ")
+        
+        # Find images in this specific column
+        images = column.find_elements(
+            By.XPATH, ".//div[@data-testid='stImageContainer']//img"
+        )
+        print(f"   - Contains {len(images)} images (expected: {exp_imgs})")
+        assert len(images) == exp_imgs, f"Column {i} has {len(images)} images instead of {exp_imgs}"
+
+        # now let's refine the search to find the images that are actually displayed
+        visible_images = [img for img in column.find_elements(
+            By.XPATH, ".//div[@data-testid='stImageContainer']//img"
+        ) if img.is_displayed()]
+        print(f"   - Contains {len(visible_images)} visible images")
+        if exp_visible:
+            assert len(visible_images) == exp_imgs, f"Column {i} has {len(visible_images)} visible images instead of {exp_imgs}"
+        else:
+            assert len(visible_images) == 0, f"Column {i} has {len(visible_images)} visible images instead of 0"
+            
+
+        # even more strict test for visibility
+        # for img in images:
+        #     style = img.get_attribute('style')
+        #     computed_style = self.driver.execute_script(
+        #         "return window.getComputedStyle(arguments[0])", img
+        #     )
+        #     print(f"Style: {style}")
+        #     print(f"Visibility: {computed_style['visibility']}")
+        #     print(f"Opacity: {computed_style['opacity']}")
+
+def get_selected_tab(self):
+    selected_tab = self.find_element(
+        By.XPATH, "//div[@data-testid='stTabs']//button[@aria-selected='true']"
+    )
+    # Get the tab text
+    tab_text = selected_tab.find_element(By.TAG_NAME, "p").text
+    # Get the tab index (might be useful)
+    tab_id = selected_tab.get_attribute("id")  # Usually ends with "-tab-X" where X is the index
+    return {
+        "text": tab_text,
+        "id": tab_id,
+        "element": selected_tab
+    }
+
+def switch_tab(self, tab_number):
+    # Click the tab
+    self.click(f"div[data-testid='stTabs'] button[id$='-tab-{tab_number}'] p")
+    
+    # Verify the switch
+    selected_tab = get_selected_tab(self)
+    if selected_tab["id"].endswith(f"-tab-{tab_number}"):
+        print(f"Successfully switched to tab {tab_number}: {selected_tab['text']}")
+    else:
+        raise Exception(f"Failed to switch to tab {tab_number}, current tab is {selected_tab['text']}")
+
+class RecorderTest(BaseCase):
+
+    @pytest.mark.slow
+    @pytest.mark.visual
+    def test_species_presentation(self):
+        # this test goes through several steps of the workflow, primarily to get to the point
+        # that species columns are displayed.
+        # - setup steps: 
+        #    - open the app
+        #    - upload two images
+        #    - validate the data entry
+        #    - click the infer button, wait for ML
+        # - the real test steps: 
+        #    - check the species columns are displayed
+        #    - switch to another tab, check the columns are not displayed
+        #    - switch back to the first tab, check the columns are displayed again
+        
+        self.open("http://localhost:8501/")
+        time.sleep(4) # even in demo mode, on full script this is needed 
+        # (the folium maps cause the scripts to rerun, which means the wait_for_element finds it, but
+        #  the reload is going on and this makes the upload files (send_keys) command fail)
+        
+        # make the file_uploader block visible -- for some reason even though we can see it, selenium can't...
+        wait_for_element(self, By.CSS_SELECTOR, '[data-testid="stFileUploaderDropzoneInput"]')
+        self.execute_script(mk_visible)
+        # send a list of files
+        self.send_keys(
+            'input[data-testid="stFileUploaderDropzoneInput"]', 
+            "\n".join([str(img_f1), str(img_f2)]),
+        )
+        
+        # advance to the next step, by clicking the validate button (wait for it first)
+        wait_for_element(self, By.XPATH, "//button//strong[contains(text(), 'Validate')]")
+        self.click('button strong:contains("Validate")')
+        # validate the progress via the text display
+        self.assert_exact_text("Progress: 2/5. Current: data_entry_validated.", 'div[data-testid="stMarkdownContainer"] p em')
+        
+        # check the tab bar is there, and the titles are correct
+        expected_texts = [
+            "Cetecean classifier", "Hotdog classifier", "Map",
+            "Dev:coordinates", "Log", "Beautiful cetaceans"
+        ]
+        self.assert_element("div[data-testid='stTabs']") 
+
+        for i, text in enumerate(expected_texts):
+            selector = f"div[data-testid='stTabs'] button[id$='-tab-{i}'] p"
+            print(f"{i=}, {text=}, {selector=}")
+            self.assert_text(text, selector)
+            break # just do one, this is slow while debuggin
+
+        # dbg: look for buttons, find out which props will isolate the right one.
+        # find_all_button_paths(self)
+
+        self.assert_element(".st-key-button_infer_ceteans button")
+        self.click(".st-key-button_infer_ceteans button")
+        
+        # check the state has advanced
+        # NOTE: FOR REMOTE RUN, IT IS STARTING FROM ZERO, SO IT HAS TO DOWNLOAD
+        # ALL MODEL FILES -> 60s timeout for this one step
+        self.assert_exact_text("Progress: 3/5. Current: ml_classification_completed.", 
+                               'div[data-testid="stMarkdownContainer"] p em',
+                               timeout=60)
+
+        # on the inference tab, check the columns and images are rendered correctly
+        # - normally it is selected by default, but we can switch to it to be sure
+        # - then we do the test for the right number of columns and images per col,
+        #   which should be visible
+        switch_tab(self, 0)
+        analyze_species_columns(self, exp_cols=2, exp_imgs=4, exp_visible=True)
+
+        # now, we want to select another tab, check somethign is present?
+        # then go back, and re-check the columns and images are re-rendered.
+        switch_tab(self, 4)
+        assert get_selected_tab(self)["id"].endswith("-tab-4")
+
+        # now we click the refresh button
+        self.click('button[data-testid="stBaseButton-secondary"]')
+        # and then select the first tab again
+        switch_tab(self, 0)
+        assert get_selected_tab(self)["id"].endswith("-tab-0")
+        # and check the columns and images are re-rendered
+        analyze_species_columns(self, exp_cols=2, exp_imgs=4, exp_visible=True)
+        
+        # now go to some other tab, and check the columns and images are not visible
+        switch_tab(self, 2)
+        assert get_selected_tab(self)["id"].endswith("-tab-2")
+        analyze_species_columns(self, exp_cols=2, exp_imgs=4, exp_visible=False)
+