Migrate the remaining specs and remove protractor related files

.github/workflows/e2e.yml

@@ -1,19 +1,14 @@
 
 name: Chaise end-to-end tests
 
-on:
-  push:
-    branches:
-      - 'master'
-  pull_request:
-    branches:
-      - 'master'
-
-concurrency: chaise_env
+on: [push]
 
 jobs:
   install-and-test:
     runs-on: ubuntu-22.04
+    strategy:
+      matrix:
+        node-version: ["18.18", "20.0.0"]
     env:
       SAUCE_USERNAME: ${{ secrets.SAUCE_USERNAME }}
       SAUCE_ACCESS_KEY: ${{ secrets.SAUCE_ACCESS_KEY }}
@@ -22,12 +17,16 @@ jobs:
       HEADLESS: false
       PYTHONWARNINGS: ignore:Unverified HTTPS request
       NODE_TLS_REJECT_UNAUTHORIZED: '0'
-    timeout-minutes: 150
+    timeout-minutes: 60
     steps:
       - name: Checkout repository code
         uses: actions/checkout@v4
         with:
           path: chaise
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
       - name: Setup the system
         run: |
           echo "node version:"
@@ -64,10 +63,6 @@ jobs:
           sudo pip3 uninstall crypto
           sudo pip3 uninstall pycrypto
           sudo pip3 install pycryptodome
-      - name: Set up JDK 1.8
-        uses: actions/setup-java@v1
-        with:
-          java-version: 1.8
       - name: Install webauthn
         run: |
           sudo useradd -m -r webauthn
@@ -154,25 +149,6 @@ jobs:
         run: |
           cd chaise
           make testdeleteprohibited
-      - name: Setup and connect to saucelabs
-        timeout-minutes: 2
-        run: |
-          curl https://saucelabs.com/downloads/sc-4.6.2-linux.tar.gz -o saucelabs.tar.gz
-          tar -xzf saucelabs.tar.gz
-          cd sc-*
-          bin/sc -u ${{secrets.SAUCE_USERNAME}} -k ${{secrets.SAUCE_ACCESS_KEY}} -i ${{github.run_id}} -f /tmp/sc_ready --no-ssl-bump-domains=127.0.0.1,localhost --pidfile=/tmp/sc_client.pid &
-      - name: Check sauce connect
-        run: |
-          while [ ! -f /tmp/sc_ready ]; do
-            echo "Waiting for Sauce Connect..."
-            sleep 5;
-          done;
-      - name: Run default config test spec  (protractor)
-        id: test-protractor-default-config
-        continue-on-error: true
-        run: |
-          cd chaise
-          make testdefaultconfig-protractor
       - name: Check on all features test spec
         if: always() && steps.test-all-features.outcome != 'success'
         run: exit 1
@@ -185,13 +161,10 @@ jobs:
       - name: Check on delete prohibited test spec
         if: always() && steps.test-delete-prohibited.outcome != 'success'
         run: exit 1
-      - name: Check on default config test spec (protractor)
-        if: always() && steps.test-protractor-default-config.outcome != 'success'
-        run: exit 1
       - uses: actions/upload-artifact@v4
         if: always()
         with:
-          name: playwright-report
+          name: playwright-report-${{ matrix.node-version }}
           path: chaise/playwright-report/
           retention-days: 30
       - name: Diagnosis after failure

Makefile

@@ -46,13 +46,12 @@ MODULES=node_modules
 # Recordedit tests
 E2EDIrecordAdd=test/e2e/specs/all-features-confirmation/recordedit/add.config.ts
 E2EDrecordEditNullValues=test/e2e/specs/default-config/recordedit/null-values.config.ts
-E2EDIrecordImmutable=test/e2e/specs/default-config/recordedit/immutable-inputs.conf.js
+E2EDIrecordImmutable=test/e2e/specs/default-config/recordedit/immutable-inputs.config.ts
 E2EDIrecordEdit=test/e2e/specs/all-features-confirmation/recordedit/edit-delete.config.ts
 # not part of the make recordedit command anymore
 E2EDIrecordMultiFormInput=test/e2e/specs/default-config/multi-form-input/multi-form-input.config.ts
 E2EDrecordEditCompositeKey=test/e2e/specs/default-config/recordedit/composite-key.config.ts
 E2EDrecordEditDomainFilter=test/e2e/specs/default-config/recordedit/domain-filter.config.ts
-E2EDrecordEditSubmissionDisabled=test/e2e/specs/default-config/recordedit/submission-disabled.conf.js
 E2ErecordEditForeignKeyDropdown=test/e2e/specs/default-config/recordedit/foreign-key-dropdown.config.ts
 E2ErecordEditInputIframe=test/e2e/specs/all-features/recordedit/input-iframe.config.ts
 # Record tests
@@ -78,28 +77,19 @@ E2EmultiPermissionsVisibility=test/e2e/specs/all-features/permissions.config.ts
 E2Efooter=test/e2e/specs/all-features-confirmation/footer/playwright.config.ts
 # errors test
 E2Eerrors=test/e2e/specs/all-features-confirmation/errors/errors.config.ts
-## Parallel test scripts (protractor)
-DefaultConfigParallel_PROTRACTOR=test/e2e/specs/default-config/protractor.conf.js
 ## Parallel test scripts
 AllFeaturesParallel=test/e2e/specs/all-features/playwright.config.ts
 AllFeaturesConfirmationParallel=test/e2e/specs/all-features-confirmation/playwright.config.ts
 DeleteProhibitedParallel=test/e2e/specs/delete-prohibited/playwright.config.ts
 DefaultConfigParallel=test/e2e/specs/default-config/playwright.config.ts
 # Setup for manual tests
-Manualrecordset=test/manual/specs/recordset.conf.js
-
-# protractor tests
-RECORDADD_TESTS_PROTRACTOR=$(E2EDIrecordMultiFormInput) $(E2EDIrecordImmutable)
-RECORDEDIT_TESTS_PROTRACTOR=$(E2EDrecordEditSubmissionDisabled)
-DEFAULT_CONFIG_PARALLEL_TESTS_PROTRACTOR=$(DefaultConfigParallel_PROTRACTOR)
-PARALLEL_TESTS_PROTRACTOR=$(DefaultConfigParallel_PROTRACTOR)
-ALL_TESTS_PROTRACTOR=$(RECORDSET_TESTS_PROTRACTOR) $(RECORDADD_TESTS_PROTRACTOR) $(RECORDEDIT_TESTS_PROTRACTOR)
+Manualrecordset=test/manual/specs/recordset.config.ts
 
 # playwright tests
 NAVBAR_TESTS=$(E2Enavbar) $(E2EnavbarHeadTitle) $(E2EnavbarCatalogConfig)
 RECORD_TESTS=$(E2EDrecord) $(E2ErecordNoDeleteBtn) $(E2EDrecordRelatedTable) $(E2EDrecordCopy) $(E2EDrecordLinks)
 RECORDSET_TESTS=$(E2EDrecordset) $(E2ErecordsetAdd) $(E2EDrecordsetEdit) $(E2ErecordsetSavedQuery) $(E2EDrecordsetIndFacet) $(E2EDrecordsetHistFacet)
-RECORDADD_TESTS=$(E2EDIrecordAdd) $(E2EDIrecordMultiFormInput) $(E2ErecordEditForeignKeyDropdown) $(E2EDrecordEditCompositeKey)
+RECORDADD_TESTS=$(E2EDIrecordAdd) $(E2EDIrecordImmutable) $(E2EDIrecordMultiFormInput) $(E2ErecordEditForeignKeyDropdown) $(E2EDrecordEditCompositeKey)
 RECORDEDIT_TESTS=$(E2EDIrecordEdit) $(E2EDrecordEditNullValues) $(E2ErecordEditInputIframe) $(E2EDrecordEditDomainFilter)
 PERMISSIONS_TESTS=$(E2EmultiPermissionsVisibility)
 FOOTER_TESTS=$(E2Efooter)
@@ -113,36 +103,23 @@ ALL_TESTS=$(NAVBAR_TESTS) $(RECORD_TESTS) $(RECORDSET_TESTS) $(RECORDADD_TESTS)
 
 ALL_MANUAL_TESTS=$(Manualrecordset)
 
-define make_test_protractor
-	rc=0; \
-	for file in $(1); do \
-		npx protractor $$file || rc=1; \
-	done; \
-	exit $$rc;
-endef
-
+# first argument is the config file location, and second argument will be passed to playwright
 define make_test
 	rc=0; \
 	for file in $(1); do \
-		 npx playwright test --project=chrome --config $$file || rc=1; \
+		 npx playwright test --project=chrome $(2) --config $$file || rc=1; \
 	done; \
 	exit $$rc;
 endef
 
-test_protractor-%:
-	$(call make_test_protractor, $($*), "0")
-
 test-%:
-	$(call make_test, $($*), "0")
+	$(call make_test, $($*))
 
 #### Sequential make commands - these commands will run tests in sequential order
 #Rule to run navbar tests
 .PHONY: testnavbar
 testnavbar: test-NAVBAR_TESTS
 
-.PHONY: testrecord-protractor
-testrecord-protractor: test_protractor-RECORD_TESTS_PROTRACTOR
-
 #Rule to run record tests
 .PHONY: testrecord
 testrecord: test-RECORD_TESTS
@@ -151,16 +128,10 @@ testrecord: test-RECORD_TESTS
 .PHONY: testrecordadd
 testrecordadd: test-RECORDADD_TESTS
 
-.PHONY: testrecordadd-protractor
-testrecordadd-protractor: test_protractor-RECORDADD_TESTS_PROTRACTOR
-
 # Rule to run record edit app tests
 .PHONY: testrecordedit
 testrecordedit: test-RECORDEDIT_TESTS
 
-.PHONY: testrecordedit-protractor
-testrecordedit-protractor: test_protractor-RECORDEDIT_TESTS_PROTRACTOR
-
 # Rule to run permission tests
 .PHONY: testpermissions
 testpermissions:test-PERMISSIONS_TESTS
@@ -182,9 +153,6 @@ testerrors: test-ERRORS_TESTS
 .PHONY: testparallel
 testparallel: test-PARALLEL_TESTS
 
-.PHONY: testparallel-protractor
-testparallel-protractor: test_protractor-PARALLEL_TESTS_PROTRACTOR
-
 #Rule to run the All features chaise configuration tests in parallel
 .PHONY: testallfeatures
 testallfeatures: test-ALL_FEATURES_PARALLEL_TESTS
@@ -201,20 +169,15 @@ testdeleteprohibited: test-DELETE_PROHIBITED_PARALLEL_TESTS
 .PHONY: testdefaultconfig
 testdefaultconfig: test-DEFAULT_CONFIG_PARALLEL_TESTS
 
-.PHONY: testdefaultconfig-protractor
-testdefaultconfig-protractor: test_protractor-DEFAULT_CONFIG_PARALLEL_TESTS_PROTRACTOR
-
 # Rule to setup schema and data for manual tests
 .PHONY: testmanually
-testmanually: test_protractor-ALL_MANUAL_TESTS
+testmanually:
+	$(call make_test, $(ALL_MANUAL_TESTS), --debug)
 
 # Rule to run tests
 .PHONY: test
 test: test-ALL_TESTS
 
-.PHONY: test-protractor
-test-protractor: test_protractor-ALL_TESTS_PROTRACTOR
-
 # ============================================================= #
 #						BULDING THE PACKAGE						#
 # ============================================================= #
@@ -428,34 +391,22 @@ endef
 # build version will change everytime it's called
 $(BUILD_VERSION):
 
-# make sure the latest webdriver is installed
-# - we fixed the version since this is the latest version that works with
-#   the protractor version that we're using.
-# - we're only using chrome, so we're ignoring gecko installation.
-.PHONY: update-webdriver
-update-webdriver:
-	node_modules/protractor/bin/webdriver-manager update --versions.standalone 3.6.0 --gecko false
-
 # install packages (honors NOD_ENV)
 # using clean-install instead of install to ensure usage of pacakge-lock.json
 .PHONY: npm-install-modules
 npm-install-modules:
 	@npm clean-install
 
 # install packages needed for production and development (including testing)
-# also run patch-package to patch all the issues in dependencies (currently only webdriver-manager.)
-# if we decided to patch other prod dependencies, we should move `patch-package` command to the `postinstall` of package.json.
 # --include=dev makes sure to ignore NODE_ENV and install everything
 .PHONY: npm-install-all-modules
 npm-install-all-modules:
 	@npm clean-install --include=dev
-	@npx patch-package
 	@npx playwright install --with-deps
 
-# for test cases we have to make sure we're installing dev dependencies and
-# webdriver is always updated to the latest version
+# for test cases we have to make sure we're installing dev dependencies and playwright is installed
 .PHONY: deps-test
-deps-test: npm-install-all-modules update-webdriver
+deps-test: npm-install-all-modules
 
 # install all the dependencies
 .PHONY: deps
@@ -574,8 +525,7 @@ usage:
 	@echo "  distclean                      the same as clean, and also removes npm dependencies"
 	@echo "  deps                           local install of node dependencies"
 	@echo "  updeps                         local update  of node dependencies"
-	@echo "  update-webdriver               update the protractor's webdriver"
-	@echo "  deps-test                      local install of dev node dependencies and update protractor's webdriver"
+	@echo "  deps-test                      local install of dev node dependencies and install playwright browsers"
 	@echo "  root-install                   should only be used as root. will use dist with proper user and then deploy, for GNU systems"
 	@echo "  root-install-alt               should only be used as root. will use dist with proper user and then deploy, for FreeBSD and MAC OS X"
 	@echo "  test                           run e2e tests"

README.md

@@ -1,9 +1,9 @@
 # Chaise (Computer-Human Access Interface with Schema Evolution) [![Build Status](https://github.com/informatics-isi-edu/chaise/workflows/Chaise%20end-to-end%20tests/badge.svg?branch=master)](https://github.com/informatics-isi-edu/chaise/actions?query=workflow%3A%22Chaise+end-to-end+tests%22+branch%3Amaster)
 
 
-A suite of web applications that adapt to the data model for data discovery, analysis, visualization, editing, sharing and collaboration. 
+A suite of web applications that adapt to the data model for data discovery, analysis, visualization, editing, sharing and collaboration.
 
-Chaise is the main front-end component of the [DERIVA asset management Platform](http://isrd.isi.edu/deriva) and utilizes [ERMrestJS](https://github.com/informatics-isi-edu/ermrestjs) client library to interact with the DERIVA services including [ERMrest](https://github.com/informatics-isi-edu/ermrest) (a general relational data storage service), [webauthn](https://github.com/informatics-isi-edu/webauthn) (authentication provider framework), [Hatrac](https://github.com/informatics-isi-edu/hatrac) (an object store service), and [deriva-web export](https://github.com/informatics-isi-edu/deriva-web/blob/master/docs/export/api.md) (allows export from an ERMrest catalog). 
+Chaise is the main front-end component of the [DERIVA asset management Platform](http://isrd.isi.edu/deriva) and utilizes [ERMrestJS](https://github.com/informatics-isi-edu/ermrestjs) client library to interact with the DERIVA services including [ERMrest](https://github.com/informatics-isi-edu/ermrest) (a general relational data storage service), [webauthn](https://github.com/informatics-isi-edu/webauthn) (authentication provider framework), [Hatrac](https://github.com/informatics-isi-edu/hatrac) (an object store service), and [deriva-web export](https://github.com/informatics-isi-edu/deriva-web/blob/master/docs/export/api.md) (allows export from an ERMrest catalog).
 
 ## Table of Contents
 
@@ -102,7 +102,7 @@ A few representative but non-exhaustive examples of these assumptions include:
 [data model]: https://en.wikipedia.org/wiki/Data_model
 [denormalized]: https://en.wikipedia.org/wiki/Denormalization
 
-Beyond these baseline assumptions about basic usage, Chaise makes almost no assumptions about the structure of the underlying [data model], such as its tables, columns, keys, foreign key relationships, etc. Chaise begins by introspecting the data model by getting the `catalog/N/schema` resource from [ERMrest]. The schema resource includes lightweight semantic annotations about the model in addition to the underlying relational database schema. 
+Beyond these baseline assumptions about basic usage, Chaise makes almost no assumptions about the structure of the underlying [data model], such as its tables, columns, keys, foreign key relationships, etc. Chaise begins by introspecting the data model by getting the `catalog/N/schema` resource from [ERMrest]. The schema resource includes lightweight semantic annotations about the model in addition to the underlying relational database schema.
 
 Chaise uses its rending heuristics to decide, for instance, how to flatten a hierarchical structure into a simplified (or [denormalized]) presentation for searching and viewing. The schema annotations are then used to modify or override its rendering heuristics, for instance, to hide a column of a table or to use a specific display name in the interface that is different than the column name from the table definition of the schema. Chaise then applies user preferences to further override the rendering decisions and annotations, for instance, to present a nested table of data in a transposed layout (i.e., with the columns and rows flipped).
 
@@ -116,7 +116,7 @@ The following are some of the documents and resources that we've prepared for us
   -  [Navbar app integration](docs/user-docs/navbar-app.md): Goes over how the Chaise's Navbar app can be embedded in other web applications.
   -  [Logging](docs/user-docs/logging.md): How Chaise is logging server requests as well as client actions.
   -  [Query parameters](docs/user-docs/query-parameters.md): Query parameters that can be used in different Chaise applications.
-- [Deveoper guides](docs/user-docs): 
+- [Deveoper guides](docs/user-docs):
   - [Chaise developer guide](docs/dev-docs/dev-guide.md): Useful information for developers of Chaise.
   - [End to End Testing](/docs/dev-docs/e2e-test.md): How end to end testing in Chaise works.
 
@@ -129,7 +129,7 @@ When developing new code for Chaise, please make sure you're following these ste
 4. update the e2e tests (if applicable);
 5. make sure the liner doesn't throw any errors (`make lint` should not fail);
 6. make sure you can deploy your code without any issues (`make dist && make deploy` should not fail);
-7. make sure that all tests are passing before submitting the pull request (`make test` should be free of errors);
+7. make sure that all tests are passing before submitting the pull request (`make testparallel` should be free of errors);
 8. make your pull request, assign it to yourself, and ask someone to review your code.
    - Try to provide as much information as you can on your PR. Explain the issues that the PR is fixing, and the changes that you've done in the PR.
    - Provide examples if applicable.
@@ -140,6 +140,7 @@ When developing new code for Chaise, please make sure you're following these ste
 ## Help and Contact
 
 Please direct questions and comments to the [project issue tracker](https://github.com/informatics-isi-edu/chaise/issues).
+
 ## License
 
 Chaise is made available as open source under the Apache License, Version 2.0. Please see the [LICENSE file](LICENSE) for more information.

docs/dev-docs/e2e-test.md

@@ -18,7 +18,7 @@ E2E tests are automation tests that simulate a user interacting with the app and
 - [**Playwright**](https://playwright.dev/): The E2e test framework that we're using.
 - **NPM**: to install necessary NodeJS packages
 - **Github workflow**: to do continuous integration (CI) by automatically testing every time code is pushed to Github repo
-- **Makefile**: to invoke NPM to install packages necessary for running tests and invoke Protractor (which will run the tests).
+- **Makefile**: to invoke NPM to install packages necessary for running tests and invoke Playwright (which will run the tests).
 
 ## Setup
 
@@ -64,11 +64,7 @@ You can get your cookie by querying the database, or using the following simple
     make deps-test
     ```
 
-    This will install all the npm dependencies that are needed and will also make sure the Selenium's WebDriver that protractor uses is updated.
-
-    - If you just want to update the WebDriver you can do `make update-webdriver`.
-    - If the version of Chrome that is installed on your machine is different from the ChromeDriver that Selenium uses, it will throw an error. So make sure both versions are always updated and compatible.
-
+    This will install all the npm dependencies that are needed and will also make sure the Playwright browsers are installed.
 
 3. Build Chaise without installing the dependencies again:
     ```sh

docs/dev-docs/manual-test.md

@@ -30,7 +30,7 @@
 - Run the "make testmanually" command in Chaise. This will set up a recordset table named Accommodation with long tooltips on the last column (Number of Rooms) and the "Operation Since" column.
 - Manually check the position of the tooltips by hovering over these columns and resizing the window so that these columns are on the window margins.
 - End the test spec by pressing ^D in the terminal
-- The test spec is present at "chaise/test/manual/specs/recordset.spec.js"
+- The test spec is present at "chaise/test/manual/specs/recordset.spec.ts"
 - The tooltip text can be changed at "chaise/test/manual/data_setup/schema/product-recordset.json"
 
 ## Recordset - auto truncation of cell content
@@ -41,7 +41,7 @@
 - Run the "make testmanually" command in Chaise. This will set up a recordset table named Accommodation with long text in 2 columns, "Summary" and "Description"
 - Maunually check that those 2 columns are truncated and have the "...more" hyperlink. Click that and make sure the column expands to show the full text. Click "...less" and make sure it properly truncates again.
 - End the test spec by pressing ^D in the terminal
-- The test spec is present at "chaise/test/manual/specs/recordset.spec.js"
+- The test spec is present at "chaise/test/manual/specs/recordset.spec.ts"
 - The tooltip text can be changed at "chaise/test/manual/data_setup/schema/product-recordset.json"