Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

[Bug]: Focusable child elements in AdvancedMarkerElement

Abierto
#704 1 comentario 1 reacción 0 asignados Ver en GitHub

Los mantenedores suelen responder en 2 días

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
3/5
Tiempo estimado
1-2 días
Aptitud para principiantes
35/100
Tipo de issue
Error
Claridad
Necesita aclaración
Estado de actividad
Estancado
Stack tecnológico
react, typescript
Área
frontend

Línea de trabajo

Comienza con el componente AdvancedMarker y reproduce la advertencia usando el ejemplo de React proporcionado con un hijo input. Rastrea cómo se gestionan los hijos enfocables y determina el comportamiento esperado para el contenido interactivo dentro de AdvancedMarkerElement; la finalización debe demostrarse comprobando que la reproducción ya no produce la advertencia ni el problema de interacción reportados.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

bug
Description

When displaying an <input type="number"> inside an <AdvancedMarker />, every click triggers the following console message:

Focusable child elements in AdvancedMarkerElement are not supported. To make AdvancedMarkerElement focusable, use addListener() to register a "click" event on the AdvancedMarkerElement instance.

Steps to Reproduce
import React from 'react';
import { AdvancedMarker } from '@vis.gl/react-google-maps';

function Component() {
  const [value, setValue] = React.useState(String(500));

  return (
    <AdvancedMarker position={{ lat: 51, lng: 0 }}>
      <input
        type="number"
        value={value}
        onChange={({ target }) => setValue(target.value)}
      />
    </AdvancedMarker>
  );
}

See CodeSandBox, but somehow the Advanced Markers are not displaying

Environment
  • Library version: 1.5.1 & 1.1.0
  • Google maps version: weekly
  • Browser and Version: Chrome 134
  • OS: macOS
Logs

Lenguaje dominante
TypeScript
Estrellas
1.9k
Forks
195
Merge medio
2 d 11 h
PR fusionados (30 d)
14

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de visgl/react-google-maps

Todos los issues de visgl/react-google-maps

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.