stephenkr / nuxt-feature-toggle

The nuxt feature toggle module

Home Page:https://www.npmjs.com/package/nuxt-feature-toggle

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

QueryString value is String instead of Boolean

mrleblanc101 opened this issue · comments

https://website.com?toggle_my-unique-key=false
This will set the feature toggle 'my-unique-key' to false when viewing the page.

In fact this will set my-unique-key to 'false'. Same when using 0|1
I've read the part about the package yn but I'm not sure how it work with the QueryString option

I created a custom plugin, not sure if that's how it should be done

// nuxt.config.js
{
    modules: [
        'nuxt-feature-toggle',
    ],
    plugins: [
        { src: '@/plugins/nuxt-feature-toggle.js' },
    ],
    publicRuntimeConfig: {
        featureToggle:{
            toggles: {
                directoryDisabled: false,
            },
        },
    },
    featureToggle: {
        queryString: true,
    },
}
// nuxt-feature-toggle.js
import yn from 'yn';

export default function ({ $featureToggle }) {
    Object.entries($featureToggle.toggles).forEach(([key, value]) => {
        $featureToggle.toggles[key] = yn(value);
    });
}

I had to transpile yn package, otherwise I had an error: Use import for es mobule.
I used import yn from "yn". I suspect Nuxt use require behind the scene on the server (nodejs) even if I'm on node 14 which support es module import.

I realise now that this break value that are not meant to be Boolean.
Ex: http://localhost:3000/dashboard?toggle_directoryEnabled=test
Will results in:

{
  directoryEnabled: undefined
}

I guess I could do:
$featureToggle.toggles[key] = yn(value) ?? value; but that just seem wrong at this point.

I opened a PR #47. Feel free to comment on it if there is any issue.

Hi @stephenkr, would you mind checking this when you have some time ?

Thank you @mrleblanc101 PR approved.