feat(browser): add ElementHandle.isInViewport method

internal/js/modules/k6/browser/common/frame.go

@@ -1573,6 +1573,36 @@ func (f *Frame) isVisible(selector string, opts *FrameIsVisibleOptions) (bool, e
 	return v, nil
 }
 
+
+// isInViewport finds the element specified by the selector and checks if it's in the viewport.
+func (f *Frame) isInViewport(selector string, strict bool) (bool, error) {
+	isInViewportAction := func(ctx context.Context, handle *ElementHandle) (any, error) {
+		script := `(function() {
+			if (!this) return false;
+			const rect = this.getBoundingClientRect();
+			return (
+				rect.top >= 0 &&
+				rect.left >= 0 &&
+				rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
+				rect.right <= (window.innerWidth || document.documentElement.clientWidth)
+			);
+		})()`
+
+		opts := evalOptions{
+			forceCallable: true,
+			returnByValue: true,
+		}
+		return handle.eval(ctx, opts, script)
+	}
+
+	v, err := f.runActionOnSelector(f.ctx, selector, strict, isInViewportAction, func() bool { return false })
+	if err != nil {
+		return false, err
+	}
+
+	return v, nil
+}
+
 // ID returns the frame id.
 func (f *Frame) ID() string {
 	f.propertiesMu.RLock()

internal/js/modules/k6/browser/common/locator.go

@@ -5,6 +5,8 @@
 	"fmt"
 	"strconv"
 	"time"
+	"strings"
+	"github.com/grafana/sobek"
 
 	"go.k6.io/k6/internal/js/modules/k6/browser/log"
 )
@@ -273,7 +275,23 @@
 	return visible, nil
 }
 
-// IsHidden returns true if the element matches the locator's
+
+
+
+func (l *Locator) IsInViewport() (bool, error) {
+	l.log.Debugf("Locator:IsInViewport", "fid:%s furl:%q sel:%q", l.frame.ID(), l.frame.URL(), l.selector)
+
+	visible, err := l.frame.isInViewport(l.selector, true)
+	if err != nil {
+		if strings.Contains(err.Error(), "failed to find element") || strings.Contains(err.Error(), "strict mode violation") {
+			return false, nil
+		}
+		return false, fmt.Errorf("checking is %q in viewport: %w", l.selector, err)
+	}
+
+	return visible, nil
+}
+
 // selector and is hidden. Otherwise, returns false.
 func (l *Locator) IsHidden() (bool, error) {
 	l.log.Debugf("Locator:IsHidden", "fid:%s furl:%q sel:%q", l.frame.ID(), l.frame.URL(), l.selector)

internal/js/modules/k6/browser/tests/frame_test.go

@@ -394,3 +394,40 @@ func TestFrameWaitForURLFailure(t *testing.T) {
 		})
 	}
 }
+
+
+
+func TestFrameElementIsInViewport(t *testing.T) {
+	t.Parallel()
+
+	tb := newTestBrowser(t)
+	p := tb.NewPage(nil)
+
+	err := p.SetContent(`
+		<a id="top-link" href="#bottom-div">Go to Bottom</a>
+		<div id="bottom-div" style="margin-top: 2000px;">I am at the bottom</div>
+	`, nil)
+	require.NoError(t, err)
+
+	mainFrame := p.MainFrame()
+
+	bottomLocator := mainFrame.Locator("#bottom-div")
+
+	inViewport, err := bottomLocator.IsInViewport()
+	require.NoError(t, err)
+	require.False(t, inViewport, "the bottom element should not be in the viewport initially")
+
+	topLocator := mainFrame.Locator("#top-link")
+
+	clickOpts := common.NewFrameClickOptions(mainFrame.Timeout())
+	err = topLocator.Click(clickOpts)
+	require.NoError(t, err)
+
+	waitOpts := common.NewFrameWaitForSelectorOptions(mainFrame.Timeout(), common.DOMElementStateVisible)
+	_, err = mainFrame.WaitForSelector("#bottom-div", waitOpts)
+	require.NoError(t, err, "waiting for #bottom-div to become visible after scroll")
+
+	inViewport, err = bottomLocator.IsInViewport()
+	require.NoError(t, err)
+	require.True(t, inViewport, "the bottom element should be in the viewport after clicking the anchor link")
+}