skip to Main Content

Hi I got unused imports warnings in VSC. My file:

import * as en from '../../src/assets/i18n/en.json'
import * as fi from '../../src/assets/i18n/fi.json'
import * as sv from '../../src/assets/i18n/sv.json'

async checkFields(language) {
    await expect(this.heading).toContainText(
      language.EinvoicesProductRegister_Heading_Title,
    )

on en.json file I got this:

"EinvoicesProductRegister_Heading_Title": "Products and services",

and I also use that checkFields method in other file:

 test('Check Product register page fields', async ({ page }) => {
    const productRegister = new ProductRegister(page)
    productRegister.checkFields('en')
  })

What should I do if I want these unused imports are not be treated as a unused in VSC when these imports are used as a parameter?

2

Answers


  1. As already mentioned in comments the imports are not used in your code, which is the crux of your issue. But the rest of the comments are less helpful.

    The issue is very basic, which indicates you would be well served by studying some programming examples. In any case, step-by-step:

    • you pass a value en into the function to indicate you want to use this particular language.

    • you need to relate or "map" that value to one of the imports you have at the top of the file

    • you can use a sequence of if() statements or you can use a switch() statement, or you can use a mapping object. The mapping object is my preference so I will show it here.

    import * as en from '../../src/assets/i18n/en.json'
    import * as fi from '../../src/assets/i18n/fi.json'
    import * as sv from '../../src/assets/i18n/sv.json'
    
    const languageMap = {
      'en': en,
      'fi': fi,
      'sv': sv
    }
    
    async checkFields(languageValue) {     // the parameter indicates the language
                                           // i.e when I see string "en"
                                           // I know I need to pick the en import
    
      const language = languageMap[languageValue]  // use the map to pick 
                                                   // the right json import
    
      await expect(this.heading).toContainText(
        language.EinvoicesProductRegister_Heading_Title,
      )
    

    You should research and try out the other methods I mention as your skills need improving – the resolution of this question should be very obvious to anyone wishing to use Playwright.

    Login or Signup to reply.
  2. Just a note that Typescript will not be happy with

    const languageMap = {
      'en': en,
      'fi': fi,
      'sv': sv
    }
    

    when used in const language = languageMap[languageValue];

    It will complain about using the string key languageValue as an index into the languageMap object. One way to fix that is to use this:

    const languageMap: Record<string, any>  = {
      'en': en,
      'fi': fi,
      'sv': sv
    };
    

    which is similar to

    const languageMap: { [key: string]: any } = {
      'en': en
      // etc.
    };
    

    For more on this type of Typescript problem, see expression of type ‘string’ can’t be used as an index.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search