Mi posición: el elemento adhesivo no es adhesivo cuando uso flexbox

Estuve atrapado en esto por un momento y pensé en compartir estoposition: sticky + caja flexible gotcha:

Mi div pegajoso funcionaba bien hasta que cambié mi vista a un contenedor de caja flexible, y de repente el div no estaba pegajoso cuando estaba envuelto en un padre de caja flexible.

.flexbox-wrapper {
  display: flex;
  height: 600px;
}
.regular {
  background-color: blue;
}
.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  background-color: red;
}
<div class="flexbox-wrapper">
  <div class="regular">
    This is the regular box
  </div>
  <div class="sticky">
    This is the sticky box
  </div>
</div>

JSFiddle mostrando el problema

Respuestas a la pregunta(1)

Su respuesta a la pregunta