javascript 开玩笑测试组件方法中的变量

Jest- testing variables inside component methods

提问by Alejandro

Let's say I have a class component that has something like this:

假设我有一个类组件，它有这样的东西：

export class Math extends React.Component {
    ...
    someComponentMethod = numb => {
        const sample = numb * 10 
        ...
        const result = numb -5
        return result
    }

Is it possible to make test assertions on samplevariable in Jest?

是否可以sample在 Jest 中对变量进行测试断言？

回答by Caleb Miller

It is not possible to write assertions for the private internals of functions.

不可能为函数的私有内部编写断言。

I've personally found this barrier to encourage better tests to be written. By testing only the public API for correctness, you have the ability to refactor internals without having to update any tests. The existing tests continue to enforce that internal changes work correctly.

我个人发现这个障碍鼓励编写更好的测试。通过仅测试公共 API 的正确性，您可以重构内部结构而无需更新任何测试。现有测试继续强制内部更改正常工作。

Writing tests against internal behavior easily increases the maintenance effort of the code being tested. Since the tests become more tightly coupled to the source code, they'll need more attention when making changes. This can also degrade the reliability of the tests, since more changes to the tests increases the likelihood of bugs manifesting in the tests themselves.

针对内部行为编写测试很容易增加被测试代码的维护工作。由于测试与源代码的耦合更加紧密，因此在进行更改时需要更加注意。这也会降低测试的可靠性，因为对测试进行更多更改会增加测试本身出现错误的可能性。

If you find yourself wanting to test some internal behavior, it might be a good time to extract some functionality. In your example, the samplevalue calculation could be extracted into a pure function of its own:

如果您发现自己想要测试某些内部行为，那么现在可能是提取某些功能的好时机。在您的示例中，sample值计算可以提取到它自己的纯函数中：

export class Math extends React.Component {
    ...

    computeSampleValue(input) {
        return input * 10
    }

    someComponentMethod = numb => {
        const sample = this.computeSampleValue(numb)
        ...
        const result = numb -5
        return result
    }
}

You can now assert that whatever logic is being used to calculate the samplevalue works as expected for various inputs. This extraction of logic often makes someComponentMethodmore readable as well.

您现在可以断言用于计算sample值的任何逻辑都按预期对各种输入起作用。这种逻辑提取通常也someComponentMethod更易读。

If you absolutely need to test some other internal behavior and are aware of the increased code debt, you can have your method perform side effects and write assertions for those. For example, instead of defining sampleas a function-scope variable, create a this.sampleproperty on the component instance and update that. In a test you then call the target method, and afterwards assert that componentInstance.samplewas changed as expected.

如果您绝对需要测试一些其他内部行为并且知道增加的代码债务，您可以让您的方法执行副作用并为它们编写断言。例如，不是定义sample为函数作用域变量，而是this.sample在组件实例上创建一个属性并更新它。在测试中，您然后调用目标方法，然后断言componentInstance.sample已按预期更改。

回答by Barak Bensimhon

I've managed to test a certain variable value inside a function the following way:

我已经设法通过以下方式测试函数内的某个变量值：

sum1.js

sum1.js

function sum() {
    result = 1 + 2;
 };

module.exports = sum;

sum1.test.js

sum1.test.js

const sum = require('./sum1');

sum();

test('adds 1 + 2 to equal 3', () => {
  expect(result).toBe(3);
});

Hope it helps, cheers!

希望能帮到你，加油！