Doesn't work with mobile links

[alanpearce]

The mobile app returns links with another schema, e.g. https://spotify.link/Lh6MLTOo2Bb.

I tried to get this working myself but couldn't figure out how best to structure it in this kind of app.

Here's a failing test.

  test('should return a song with a valid shortLink - Song', async ({ page }) => {
    const shortLinkSong = 'https://spotify.link/Lh6MLTOo2Bb';
    const searchCard = page.getByTestId('search-card');

    await page.fill('#song-link', spotifyLinkSong);
    await page.press('#song-link', 'Enter');

    const searchCardText = await searchCard.textContent() ?? '';

    expect(searchCardText).toContain('Do Not Disturb');
    expect(searchCardText).toContain('Drake · Song · 2017');
    expect(searchCardText).toContain('Listen on Youtube');
    expect(searchCardText).toContain('Listen on Deezer');
    expect(searchCardText).toContain('Listen on Apple Music');
    expect(searchCardText).toContain('Listen on Tidal');
    expect(searchCardText).toContain('Listen on SoundCloud');

    const youtubeLink = await page.getByText('Listen on Youtube').getAttribute('href');
    const deezerLink = await page.getByText('Listen on Deezer').getAttribute('href');
    const appleMusicLink = await page.getByText('Listen on Apple Music').getAttribute('href');
    const tidalLink = await page.getByText('Listen on Tidal').getAttribute('href');
    const soundcloudLink = await page.getByText('Listen on SoundCloud').getAttribute('href');

    expect(youtubeLink).toBe('https://www.youtube.com/watch?v=zhY_0DoQCQs');
    expect(deezerLink).toBe('https://www.deezer.com/track/144572248');
    expect(appleMusicLink).toBe('https://music.apple.com/us/album/do-not-disturb/1440890708?i=1440892237');
    expect(tidalLink).toBe('https://listen.tidal.com/search?q=Do%20Not%20Disturb%20Drake');
    expect(soundcloudLink).toBe('https://soundcloud.com/search/sounds?q=Do%20Not%20Disturb%20Drake');
  });

The regex needs updating:

export const SPOTIFY_LINK_REGEX = /^https:\/\/(open\.spotify\.com\/(track|album|playlist|artist|episode|show)|spotify.link)\/.*$/;

Unfortunately, after that it's not as simple as updating the fetch call to fetch(spotifyLink, { redirect: 'follow' }) as it redirects to a page that tries to open the app or show a button with a link to the correct URL. (I would use a[href^=https://open.spotify.com to get this)

[sjdonado]

I'll open a separate PR to address this issue :)