test(fixture): make scoping test case more representative of intended usage

Also, update the description for the same reason.

Author: jrolfs

test/fixture/fixture.test.ts

@@ -147,12 +147,9 @@ test.describe('lib/fixture.ts', () => {
     expect(await $h3.textContent()).toEqual('Hello h3')
   })
 
-  test('should work with destructuring', async ({page}) => {
-    const document = await getDocument(page)
-    const scope = await document.$('#scoped')
-
+  test('scoping queries with `within`', async ({queries: {getByTestId}}) => {
     // eslint-disable-next-line @typescript-eslint/unbound-method
-    const {queryByText} = within(scope)
+    const {queryByText} = within(await getByTestId('scoped'))
 
     expect(await queryByText('Hello h1')).toBeFalsy()
     expect(await queryByText('Hello h3')).toBeTruthy()

test/fixtures/page.html

@@ -9,7 +9,7 @@ <h2 data-id="second-level-header">Hello h2</h2>
     <input id="label-text-input" type="text" />
 
     <button role="button">getByRole Test</button>
-    <div id="scoped">
+    <div id="scoped" data-testid="scoped">
       <h3>Hello h3</h3>
     </div>