Cuando estamos trabajando en un proyecto con SharePoint Framework, en el 99% de las veces te ves obligado a utilizar la maravillosa librería de @pnp, o en su defecto la antigua sp-pnp-js. La librería @pnp es una librería de código abierto y en continuo desarrollo elaborada por el equipo de Pattern and Practice para ayudar a los programadores de SharePoint Framework y que cuenta con una enorme funcionalidad.

Vamos a utilizar @pnp para recuperar los elementos de una lista, como ponemos en las siguientes líneas de código:

sp.web.lists
.getByTitle("RockYOList")
.items
.filter(`ID gt 500 and ID le 600`)
.select('ID', 'RockYOLookup/Title')
.expand('RockYOLookup')
.get().then(r => {
   r.map(i => console.log(i));
});

En Chrome este código nos devuelve los resultados esperados, pero el problema llega cuando nos pasamos al navegador IE11 que utilizan la mayoría de nuestros clientes. El IE11, al igual que otros navegadores antiguos, no cuentan con cierta funcionalidad que es necesaria para utilizar características de ES6 como puede ser fetch, map o promise.

Para solventar este problema es necesario utilizar polyfills. Los polyfills son piezas de código  que te permite trabajar con una tecnología que no soporta el navegador de forma nativa, es decir, te permite usar características de navegadores nuevos en navegadores antiguos.

Para ello tenemos que descargarnos de npm el siguiente paquete:

npm i @pnp/polyfill-ie11@latest

Además, debemos importar en el código donde estamos usando la librería de @pnp lo siguiente:

import "@pnp/polyfill-ie11";
import { sp } from "@pnp/sp";

 

Happy Codding folks!!!