test: Enhanced Jasmine & Jest playground for better types testing (#2114)

* Jasmine test update with type and asymmetric matcher limitations

* Use a standalone jest playground to test jest's augmentation properly

* fix any

* Fix Greptile comments

Author: dprevost-LMI

playgrounds/jasmine/README.md

@@ -0,0 +1,16 @@
+# Jasmine Playground
+
+This is a playground for E2E testing with the `@wdio/jasmine-framework` to ensure compatibility with `expect-webdriverio`.
+
+## Features and Limitations
+
+*   **Soft Assertions**: `SoftAssertionService` is not supported, as Jasmine provides similar behavior natively.
+*   **Snapshots**: Basic snapshot testing currently does not work well.
+*   **Visual Snapshots**: The `@wdio/visual-service` does not work properly due to a lack of compatible hooks in Jasmine.
+*   **Options Configuration**: Global configurations (like `setOptions({ wait: 500 })`) are fully supported.
+*   **Asymmetric Matchers**: Native Jasmine asymmetric matchers (like `jasmine.any()`) are not properly supported (coming soon).
+
+## Test Structure
+
+*   `test/specs/expect-wdioImport/`: Tests using the direct import of `expect-webdriverio` (Jest-based).
+*   `test/specs/globalImport/`: Tests using the global import, which pulls the Jasmine `expect` by default.

playgrounds/jasmine/eslint.config.mjs

@@ -1,5 +1,6 @@
 import tsEslintPlugin from '@typescript-eslint/eslint-plugin';
 import tsParser from '@typescript-eslint/parser';
+import jasminePlugin from 'eslint-plugin-jasmine';
 
 export default {
   files: ['**/*.ts', '**/*.js'],
@@ -20,9 +21,11 @@ export default {
   },
   plugins: {
     '@typescript-eslint': tsEslintPlugin,
+    'jasmine': jasminePlugin,
   },
   rules: {
     ...tsEslintPlugin.configs['recommended'].rules,
     '@typescript-eslint/no-floating-promises': 'error',
+    'jasmine/no-focused-tests': 'error',
   },
 };

playgrounds/jasmine/package.json

@@ -12,6 +12,7 @@
   "devDependencies": {
     "@types/jasmine": "^5.1.15",
     "@wdio/jasmine-framework": "^9.27.2",
+    "eslint-plugin-jasmine": "^4.2.2",
     "expect-webdriverio": "file:../.."
   },
   "peerDependencies": {

playgrounds/jasmine/test/specs/basic-matchers.test.ts

@@ -0,0 +1,193 @@
+import { browser, $, $$ } from '@wdio/globals'
+import { expect } from 'expect-webdriverio'
+
+describe('Basic Expect Matchers available when pulling expect from expect-webdriverio directly', () => {
+    beforeEach(async () => {
+        await browser.url('https://webdriver.io')
+    })
+
+    describe('Boolean matchers', () => {
+        it('should verify truthy values', async () => {
+            const element = await $('.navbar')
+            const isDisplayed = await element.isDisplayed()
+
+            await expect(isDisplayed).toBe(true)
+            await expect(isDisplayed).toBeTruthy()
+        })
+
+        it('should verify falsy values', async () => {
+            const element = await $('.non-existent-element')
+            const exists = await element.isExisting()
+
+            await expect(exists).toBe(false)
+            await expect(exists).toBeFalsy()
+        })
+    })
+
+    describe('String matchers', () => {
+        it('should match exact text', async () => {
+            const title = await browser.getTitle()
+            await expect(title).toContain('WebdriverIO')
+        })
+
+        it('should match with regex', async () => {
+            const url = await browser.getUrl()
+            await expect(url).toMatch(/^https:\/\/webdriver\.io/)
+        })
+    })
+
+    describe('Number matchers', () => {
+        it('should compare numbers', async () => {
+            const navLinks = await $$('nav a')
+            const count = navLinks.length
+
+            await expect(count).toBeGreaterThan(5)
+            await expect(count).toBeGreaterThanOrEqual(6)
+            await expect(count).toBeLessThan(100)
+            await expect(count).toBeLessThanOrEqual(50)
+        })
+    })
+
+    describe('Negation', () => {
+        it('should work with not', async () => {
+            const title = await browser.getTitle()
+
+            await expect(title).not.toBe('')
+            await expect(title).not.toContain('Firefox')
+        })
+    })
+
+
+    describe('Array matchers', () => {
+        it('should verify array contents', async () => {
+            const navLinks = await $$('nav a')
+            const hrefs: string[] = []
+            for (const link of navLinks) {
+                const href = await link.getAttribute('href')
+                if (href) hrefs.push(href)
+            }
+
+            await expect(hrefs).toBeInstanceOf(Array)
+            await expect(hrefs.length).toBeGreaterThan(0)
+            await expect(hrefs).toEqual(expect.arrayContaining(['/docs/gettingstarted']))
+        })
+    })
+
+    describe('Object matchers', () => {
+        it('should match object properties', async () => {
+            const capabilities = await browser.capabilities
+
+            await expect(capabilities).toHaveProperty('browserName')
+            await expect(capabilities).toMatchObject({
+                browserName: 'chrome'
+            })
+        })
+    })
+
+    describe('Async/Promise matchers', () => {
+        it('should handle promises', async () => {
+            const titlePromise = browser.getTitle()
+
+            // @ts-expect-error - to fix
+            await expect(titlePromise).resolves.toContain('WebdriverIO')
+        })
+
+        it('should not reject', async () => {
+            const urlPromise = browser.getUrl()
+
+            // @ts-expect-error - to fix
+            await expect(urlPromise).resolves.toBeDefined()
+        })
+    })
+
+    describe('Basis matcher with Jasmine asymmetric matchers', () => {
+        it('should have toEqual work with jasmine.stringContaining', async () => {
+            // eslint-disable-next-line -- to fix
+            expect('title').toEqual(jasmine.stringContaining('title'))
+        })
+
+        it('should have toEqual work with jasmine.any', async () => {
+            // eslint-disable-next-line -- to fix
+            expect('title').toEqual(jasmine.any(String))
+            // eslint-disable-next-line -- to fix
+            expect(123).toEqual(jasmine.any(Number))
+        })
+
+        // TODO to support one day?
+        xit('should have toEqual work with jasmine.objectContaining', async () => {
+            // eslint-disable-next-line -- to fix
+            expect({ a: 1, b: 2 }).toEqual(jasmine.objectContaining({ a: 1 }))
+        })
+
+        // TODO to support one day?
+        xit('should have toEqual work with jasmine.arrayContaining', async () => {
+            // eslint-disable-next-line -- to fix
+            expect([1, 2, 3]).toEqual(jasmine.arrayContaining([2]))
+        })
+
+        it('should have toEqual work with jasmine.stringMatching', async () => {
+            // eslint-disable-next-line -- to fix
+            expect('title').toEqual(jasmine.stringMatching(/itl/))
+        })
+
+        it('should have toEqual work with jasmine.anything', async () => {
+            // eslint-disable-next-line -- to fix
+            expect({ foo: 'bar' }).toEqual({ foo: jasmine.anything() })
+        })
+
+        it('should have toBe not work with stringContaining', async () => {
+            // eslint-disable-next-line -- to fix
+            expect(() => {
+                // eslint-disable-next-line -- to fix
+                expect('title').toBe(jasmine.stringContaining('title'))
+            }).toThrow()
+        })
+    })
+
+    describe('Basis matcher with asymmetric matchers', () => {
+        it('should have toEqual work with expect.stringContaining', async () => {
+            // eslint-disable-next-line -- to fix
+            expect('title').toEqual(expect.stringContaining('title'))
+        })
+
+        it('should have toEqual work with expect.any', async () => {
+            // eslint-disable-next-line -- to fix
+            expect('title').toEqual(expect.any(String))
+            // eslint-disable-next-line -- to fix
+            expect(123).toEqual(expect.any(Number))
+        })
+
+        it('should have toEqual work with expect.objectContaining', async () => {
+            // eslint-disable-next-line -- to fix
+            expect({ a: 1, b: 2 }).toEqual(expect.objectContaining({ a: 1 }))
+        })
+
+        it('should have toEqual work with expect.arrayContaining', async () => {
+            // eslint-disable-next-line -- to fix
+            expect([1, 2, 3]).toEqual(expect.arrayContaining([2]))
+        })
+
+        it('should have toEqual work with expect.stringMatching', async () => {
+            // eslint-disable-next-line -- to fix
+            expect('title').toEqual(expect.stringMatching(/itl/))
+        })
+
+        it('should have toEqual work with expect.anything', async () => {
+            // eslint-disable-next-line -- to fix
+            expect({ foo: 'bar' }).toEqual({ foo: expect.anything() })
+        })
+
+        it('should have toEqual work with expect.closeTo', async () => {
+            // eslint-disable-next-line -- to fix
+            expect({ num: 1.1 }).toEqual({ num: expect.closeTo(1.101, 2) })
+        })
+
+        it('should have toBe not work with stringContaining', async () => {
+            // eslint-disable-next-line -- to fix
+            expect(() => {
+                // eslint-disable-next-line -- to fix
+                expect('title').toBe(expect.stringContaining('title'))
+            }).toThrow()
+        })
+    })
+})

playgrounds/jasmine/test/specs/expect-wdioImport/basic-matchers.test.ts

@@ -1,4 +1,5 @@
 import { browser, $, $$ } from '@wdio/globals'
+import { expect } from 'expect-webdriverio'
 
 describe('WebdriverIO Custom Matchers', () => {
     beforeEach(async () => {