16personalities missing personality avatar

[rakuzen25]

Not sure if it's just me, but my personality avatar is missing from the rendered output:

The output from the debug log:

{
    name: '16personalities',
    result: {
      sections: [ 'personality', 'profile', 'traits' ],
      color: 'rgb(51, 164, 116)',
      type: 'ENFJ-T',
      personality: [
        {
          category: 'Personality',
          value: 'Turbulent Protagonist',
          image: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mOcOnfpfwAGfgLYttYINwAAAABJRU5ErkJggg==',
          text: 'Turbulent Protagonists are Extraverted, Intuitive, Feeling, Judging and Turbulent. These warm, forthright types love helping others and have the creative energy to achieve their goals.'
        },
        {
          category: 'Role',
          value: 'Diplomats',
          image: 'data:image/svg+xml;base64,PHN2ZyBpZD0icm9sZV9kaXBsb21hdHMiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDEzMCAxMzAiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDojYzJlMWQ0O30uY2xzLTJ7ZmlsbDojZjRmOWY2O30uY2xzLTN7ZmlsbDojMjk4YTYyO30uY2xzLTR7ZmlsbDojMm'... 17222 more characters,
          text: 'Diplomats focus on empathy and cooperation, shining in diplomacy and counselling. They’re imaginative, warm, empathic, and influential people, often playing the role of harmonizers.'
        },
        {
          category: 'Strategy',
          value: 'Social Engagement',
          image: 'data:image/svg+xml;base64,PHN2ZyBpZD0ic3RyYXRlZ3lfc29jaWFsX2VuZ2FnZW1lbnRfZGlwbG9tYXRzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMzAgMTMwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2MyZTNkNTt9LmNscy0ye2ZpbGw6I2Y4ZmNmYTt9LmNscy0ze2ZpbGw6I2'... 10638 more characters,
          text: 'Social Engagers are restless, perfectionistic people, prone to experiencing very positive and negative emotions. They’re curious and willing to work hard, making them high-achievers.'
        }
      ],
      traits: [
        {
          category: 'Mind',
          value: 'Extraverted',
          score: 0.63,
          text: ' Likely gets energized by social interaction and tends to openly express their enthusiasm and excitement.'
        },
        {
          category: 'Energy',
          value: 'Intuitive',
          score: 0.73,
          text: ' Likely very imaginative and open-minded, focusing on hidden meanings and distant possibilities.'
        },
        {
          category: 'Nature',
          value: 'Feeling',
          score: 0.61,
          text: ' Likely values emotional expression and sensitivity, prioritizing empathy, social harmony, and cooperation.'
        },
        {
          category: 'Tactics',
          value: 'Judging',
          score: 0.67,
          text: ' Likely decisive, thorough, and highly organized. Values clarity and prefers planning to spontaneity.'
        },
        {
          category: 'Identity',
          value: 'Turbulent',
          score: 0.54,
          text: ' Likely self-conscious, sensitive to stress, success-driven, perfectionistic, and eager to improve.'
        }
      ]
    }
  }

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mOcOnfpfwAGfgLYttYINwAAAABJRU5ErkJggg== is a 1x1 gray square as seen in the output above.

Executing this snippet in the browser gives the correct external link to the SVG for all three cards:

metrics/source/plugins/community/16personalities/index.mjs

Lines 26 to 31 in f6c4f63

	personality: [...document.querySelectorAll(".personality-cards .sp-personality-card")].map(card => ({
	category: card.querySelector(".card__title").innerText,
	value: card.querySelector(".card__subtitle").innerText,
	image: card.querySelector(".card__image").src,
	text: card.querySelector(".card__text").innerText,
	})),

Output from the browser:

[
    {
        "category": "Your Personality",
        "value": "Turbulent Protagonist\n(ENFJ-T)",
        "image": "https://www.16personalities.com/static/images/personality-types/avatars/enfj-protagonist-male.svg?v=2",
        "text": "Your Personality\nTurbulent Protagonist\n(ENFJ-T)\nTurbulent Protagonists are Extraverted, Intuitive, Feeling, Judging and Turbulent. These warm, forthright types love helping others and have the creative energy to achieve their goals."
    },
    {
        "category": "Your Role",
        "value": "Diplomats",
        "image": "https://www.16personalities.com/static/images/profile/badges/role-diplomat.svg",
        "text": "Your Role\nDiplomats\nDiplomats focus on empathy and cooperation, shining in diplomacy and counselling. They’re imaginative, warm, empathic, and influential people, often playing the role of harmonizers."
    },
    {
        "category": "Your Strategy",
        "value": "Social Engagement",
        "image": "https://www.16personalities.com/static/images/profile/badges/strategy-social-engagement-diplomat.svg",
        "text": "Your Strategy\nSocial Engagement\nSocial Engagers are restless, perfectionistic people, prone to experiencing very positive and negative emotions. They’re curious and willing to work hard, making them high-achievers."
    }
]

So I'd imagine something went wrong on line 46:

metrics/source/plugins/community/16personalities/index.mjs

Lines 43 to 48 in f6c4f63

	const personality = await Promise.all(raw.personality.map(async ({category, value, image, text}) => ({
	category,
	value: value.replace(`(${type})`, "").trim(),
	image: await imports.imgb64(image),
	text: text.replace(`${category}\n${value}\n`, "").trim(),
	})))

[lowlighter]

Hi 👋 !

This should be fixed in next release 👍
Seems that for some personalities it uses an updated version of the image (like image.svg?v=2) so it was having trouble detecting the file extension when converting to base64. The gray image is the placeholder fallback 🙂